javascript - Angular 5双向绑定(bind)更新另一个字段

Question

我在导出类中有两个字段。该模板有一个下拉列表，其 ngModel 通过双向绑定(bind)绑定(bind)到第一个字段 (selectedInterval)。当下拉选项更改时，calculateReviewDate() 事件发生并成功更新第二个字段 (nextReviewDate)，但下拉列表保持空白，直到我选择相同的选项两次。此外，微调器在计算过程中永远不会出现。有谁知道为什么？

<form #FormVar="ngForm" novalidate>
  <div class="form-group">
    <div class="row">
      <div class="col col-md-2 col-sm-3">
          <input type="text" [ngModel]="nextReviewDate | date:shortDate" name="nextReviewDate" id="nextReviewDate1" class="form-control" disabled/>
      </div>
      <div class="col col-md-1 com-sm-3" *ngIf="showSpinner">
        <fa [name]="'spinner'" [size]=1 [spin]=true></fa>
      </div>
      <div class="col col-md-2 col-sm-3">
        <select class="form-control" name="nextReviewDate" id="nextReviewDate2" [(ngModel)]="selectedInterval" (change)="calculateReviewDate()">
                          <option *ngFor="let r of reviewIntervals" [value]="r.interval">{{r.intervalDescription}}</option>
                        </select>
      </div>
    </div>
  </div>

  <button type="submit" class="btn btn-primary" [disabled]="!FormVar.valid" (click)="save(FormVar)">Review Note</button>

</form>

calculateReviewDate(): void {
  this.showSpinner = true;
  let calculator: calculateDate = new calculateDate();
  let today: Date = new Date();
  this.nextReviewDate = calculator.addMonth(today, this.selectedInterval);
  this.showSpinner = this.nextReviewDate === undefined;
}

Answer 1

如何获得 reviewIntervals？对于微调器，我认为是因为太快了，尝试在 this.showSpinner = this.nextReviewDate === undefined; 之前添加延迟，例如设置超时。