Angular Form Control 导致无限循环答案

【问题标题】：Angular's FormControl cause an infinite loopAngular Form Control 导致无限循环
【发布时间】：2021-07-14 15:45:42
【问题描述】：

我有以下逻辑：

1.component.ts

onChangeRow($event) {
    form.controls["value"].patchValue($event.data.value, { emitEvent: false }); // 
}

2.component.ts

@Output() changeRow: EventEmitter<any> = new EventEmitter<any>();

this.formGroup.valueChanges.subscribe(data => {
  this.changeRow.emit({selfRef: this.selfRef, form: this.formGroup, config: this.config})
})

看起来第一个组件中的patchValue 方法触发了一个循环，因为它的新值被valueChanges 捕获，并且循环继续，直到我收到Maximum call stack size exceeded 错误。有时它只触发 3 次，有时只触发一次。

我试图理解为什么 emitEvent 属性在这里不起作用。

【问题讨论】：

看看这是否能解决问题：stackoverflow.com/a/53460744/6513921
我做了，但它似乎不起作用。我也尝试使用distinctUntilChanged，但这似乎也不太有效，因为我在我的第一个组件中修补了几个表单控件

标签： angular angular-reactive-forms infinite-loop form-control

【解决方案1】：

尝试在 patchValue() 选项参数中将 onlySelf 设置为 true。

onChangeRow($event) {
    form.controls["value"].patchValue($event.data.value, { onlySelf: true, emitEvent: false }); 
}

【讨论】：

效果很好！我希望我能先在 Angular 网站上找到它……