Question

我想在运行时更改我的最小日期。

    <input class="form-control" id="endDateTime" [owlDateTime]="endDateTime" [owlDateTimeTrigger]="endDateTime"
                  [min]='endDateTimePickerConfig.min' placeholder="End Date Time" formControlName="endDateTime">
                <owl-date-time #endDateTime [firstDayOfWeek]='endDateTimePickerConfig.firstDayOfWeek'
                  [hour12Timer]='endDateTimePickerConfig.hour12Timer'></owl-date-time>

  public startDateTimePickerConfig = {
    min: new Date(),
    firstDayOfWeek: 1,
    hour12Timer: true
  };

  public endDateTimePickerConfig = Object.assign({}, this.startDateTimePickerConfig);;

    constructor() {
          this.initializeEndDate(this.startDateTimePickerConfig.min);
        }

      private initializeEndDate(startDateTime: Date): void {
        this.endDateTimePickerConfig.min = this.incrementMinutes(this.endDateTimePickerConfig.min, 1);
      }

    private incrementMinutes(date: Date, minutes: number): Date {
        return new Date(date.getFullYear(),
          date.getMonth(),
          date.getDate(),
          date.getHours(),
          date.getMinutes() + minutes,
          date.getSeconds(),
          date.getMilliseconds());
      }

但是，当打字稿中的最小日期更改时，UI仅刷新选择框https://i.stack.imgur.com/5MvME.png，但是在单击“设置”后，输入将充满旧的分钟。 https://i.stack.imgur.com/imhja.png这是一些奇怪的行为。有什么建议么？ PS：https://www.npmjs.com/package/ng-pick-datetime

Answer 1

我想问题是您正在更改对象属性（this.endDateTimePickerConfig.min）中的值。尝试创建一个新的“普通”属性并将其设置为[min]属性。

示例：

.ts
minEndDateTimePickerConfig: Number;
...
private initializeEndDate(startDateTime: Date): void {
   this.minEndDateTimePickerConfig = this.incrementMinutes(this.minEndDateTimePickerConfig, 1);
}

.html
[min]='minEndDateTimePickerConfig'

以编程方式更改结束日期时间

1 个答案: