如何以反应形式valueChanges从递归调用中退出

Question

我观察formControl的valueChanges。表单控件是一个date picker。选择日期后，我会尝试将其重新格式化为yyyy-MM-dd原始MM-dd-yyyy格式。我直接修改表单控件的值。因此，它给了我递归调用错误。显然是真的。有什么解决办法吗？

代码：

this.parentForm.controls['myControlName'].valueChanges.subscribe((val)=>{
this.parentForm.controls['myControlName'].setValue(this._datePipe.transform(new Date(val), 'yyyy-MM-dd'));
});

<input #inputDate type="text" class="form-control" placeholder="Select date"
  [formControl]="parentForm.controls['myControlName']"
  [value]="selectedDate | date : 'MM-dd-yyyy'"/>
  <datepicker [ngModel]="selectedDate" [minDate]="minDate"
    [maxDate]="maxDate"
    [showWeeks]="false"
    [startingDay]="1"
    (selectionDone)="onSelectionDone($event)">
  </datepicker>

错误：

例外：./ DatePickerComponent类DatePickerComponent中的错误-内联模板：13：8由以下原因引起：递归过多error_handler.js：54原始例外：递归过多

Answer 1

由于表单控件的setValue方法valueChange默认情况下会引发事件，因此您将遇到死循环。您可以设置emitEvent为false来防止它。

this.parentForm.controls['myControlName'].setValue(this._datePipe.transform(new Date(val), 'yyyy-MM-dd'), { emitEvent: false });