有没有办法防止 formControl 触发事件？

Question

我有 3 个字段与类型为数字的表单相关联，当我修改字段 A 时，它会修改字段 B 和 C，当我修改字段 B 时，它会修改字段 A 和 C，当我修改字段 C 时，它会相应地修改字段 A 和 B。

我的组件如下：

this.form= this.formBuilder.group({
   fieldA: new FormControl(this.valueA),
   fieldB: new FormControl(this.valueB),
   fieldC: new FormControl(this.valueC),
});

onFieldAchanged() {
   //Do some calculs
   this.form.get('fieldB').setValue(x);
   this.form.get('fieldC').setValue(y);
}

onFieldBchanged() {
   //Do some calculs
   this.form.get('fieldA').setValue(x);
   this.form.get('fieldC').setValue(y);
}

onFieldCchanged() {
   //Do some calculs
   this.form.get('fieldA').setValue(x);
   this.form.get('fieldB').setValue(y);
}

和我的模板如下：

<input formControlName="fieldA" type="number" class="form-control" (ngModelChange)="onFieldAchanged()"/>
<input formControlName="fieldB" type="number" class="form-control" (ngModelChange)="onFieldBchanged()"/>
<input formControlName="fieldC" type="number" class="form-control" (ngModelChange)="onFieldCchanged()"/>

当您修改其中一个字段时，问题就会出现，它会进入一个循环并使应用程序崩溃。

我已经尝试emitEvent: false在我的中添加参数setValue()但它没有改变

所以我的问题：有没有办法防止触发其他功能？当我修改时，fieldA我只想输入我的onFieldAchanged()函数并设置另外两个值，没有更多。

感谢您的帮助

Answer 1

肯定有：

首先，不要使用 ，而是(ngModelChange)使用valueChanges可观察的：

this.form.get('fieldA').valueChanges.subscribe(v => this.onFieldAchanged());
this.form.get('fieldB').valueChanges.subscribe(v => this.onFieldBchanged());
this.form.get('fieldC').valueChanges.subscribe(v => this.onFieldCchanged());

然后，将emitEvent选项添加到您的setValue功能中以阻止它们valueChanges发出：

onFieldAchanged() {
   //Do some calculs
   this.form.get('fieldB').setValue(x, {emitEvent: false});
   this.form.get('fieldC').setValue(y, {emitEvent: false});
}

问题是ngModel与反应形式混合。得选一个。