根据其他控件的值计算窗体组控件值 Using angular 6

Question

我有一个名为 "totalMembers" 的表单域。它的值将是我们正在选择的某些成员类型（例如 [=17= 的数量]、学生的数量等）的总和。所以它应该动态改变它的值并同时显示在 window 上。我想知道，有没有办法在表单组本身内部编写自定义方法（如自定义验证）来更新它的值。

以下是我的表格组

testform: FormGroup;

this.testform = this.formBuilder.group({
      numberofchildren: [0, Validators.required],
      numberofstudents: [0, Validators.required],
      handicapped: [0, Validators.required],
      numberoftestnumbers: [0, Validators.required],
      totalMembers: [0, Validators.required],
      comments: ['', Validators.required],
    });

Answer 1

您可以像这样订阅 valueChanges 事件：

this.testform.get('numberofchildren').valueChanges.subscribe((value: string) => {
  // code logic here
  this.updateForm.get('totalMembers').setValue('something');
  this.updateForm.get('totalMembers').updateValueAndValidity({ onlySelf: true, emitEvent: false });
});
this.testform.get('numberofstudents').valueChanges.subscribe((value: string) => {
  // code logic here
  this.updateForm.get('totalMembers').setValue('something');
  this.updateForm.get('totalMembers').updateValueAndValidity({ onlySelf: true, emitEvent: false });
});
// others form control ...

其他方式，您可以绑定 ngModel 并使用 ngModelChange 事件

根据其他控件的值计算窗体组控件值 Using angular 6

Calculate the form group control value according the values of other controls Using angular 6

typescript

formgroups

angular7