Question

我正在使用两个日期选择器从日期和到目前为止，实际上我想要的是当用户选择一个日期（从日期选择器）并且该日期大于（到日期选择器）它的值应该然后分配（从日期选择器）值到（到日期选择器）也是如此，反之亦然。

我正在使用以下代码，但它无法正常工作

组件文件

if (callFrom == 'from' && claimCharge.Dos_From) {
  if (this.getLengthOfYear(claimCharge.Dos_To)) {
    if (this.checkIfTodayDate(claimCharge.Dos_To)) {
      if (this.getLengthOfDate(claimCharge.Dos_From)) {
        .Dos_To = claimCharge.Dos_From;
      }
    }
  }
}


if (callFrom == 'from' && claimCharge.Dos_From) {
  if (claimCharge.Dos_From >= claimCharge.Dos_To) {
    if (this.getLengthOfYear(claimCharge.Dos_From)) {
      if (claimCharge.Dos_To.toString() != new Date(new Date().setHours(0, 0, 0, 0)).toString() as any) {
        claimCharge.Dos_To = claimCharge.Dos_From;
      }
    }
  }
}

HTML：

<datetime  [attr.id]="'txtProcedureDOSTo_'+ndx" [timepicker]="false" [datepicker]="datepickerOpts" (ngModelChange)="methodFromAndToCheck(p,'to')" [(ngModel)]="p.Dos_To" ></datetime>
<datetime  [attr.id]="'txtProcedureDOSFrom_'+ndx" [timepicker]="false" [datepicker]="datepickerOpts" (ngModelChange)="methodFromAndToCheck(p,'from')" [(ngModel)]="p.Dos_From"></datetime>

Answer 1

希望我理解正确，这是我的解决方案：

HTML：

 <input placeholder="From" [(ngModel)]="from" type="date" (change)="onChange('from')">

 <input placeholder="To" [(ngModel)]="to" type="date" (change)="onChange('to')">

TS组件：

import {Component, OnInit} from '@angular/core'

@Component({
  selector: 'date',
  templateUrl: './date.component.html',
  styleUrls: ['./date.component.css']
})
export class DateComponent implements OnInit {
  from: string;
  to: string;

  ngOnInit(){
    // get current date to set the starting values for inputs
    // d is a type of Date()

    let d = new Date();

    // d.toISOString() returns date in format YYYY-MM-DDTHH:mm:ss.sssZ
    // since input of "date" type uses YYYY-MM-DD format
    // we take first 10 characters with .slice(0,10)

    this.from = d.toISOString().slice(0,10);
    this.to = d.toISOString().slice(0,10);
  }

  onChange(input: string){
    if (input === 'from') {
      // if Date from input "to" is less than from input "from"
      // value of the input "to" is equal to value of the input "from"

      this.to = new Date(this.to) < new Date(this.from) ? this.to = this.from : this.to;

    } else {

      // if Date from input "to" is less than from input "from"
      // value of the input "from" is equal to value of the input "to"

      this.from = new Date(this.to) < new Date(this.from) ? this.from = this.to : this.from;

    }
  }
}

让我知道它是否适合你。

使用ngModelChange，当用户首次使用日期选择器选择日期时，它不会更改日期

1 个答案: