Angular Iterate over Reactive Form Controls and Subchildren 等

Question

我需要遍历 Formbuilder 中的所有控件，以及子表单构建器以清除验证器和 updateValueAndValidity。我怎样才能从这里更新答案？

Angular 2: Iterate over reactive form controls

Object.keys(this.form.controls).forEach(key => {
    this.form.controls[key].clearValidators();
    this.form.controls[key].updateValueAndValidity();
  });

这里的表单在表单构建器等中有表单构建器。上面的答案只影响顶级子级，不影响子级等

this.editSharedForm = this.formBuilder.group({
  'name': [null, [Validators.maxLength(50)]],
  'streetAddress': [null, [Validators.maxLength(50)]],
  'city': [null, [Validators.required,Validators.maxLength(200)]],
  'zipcode': [null, [Validators.maxLength(10)]],
  'phoneNumber': [null, [Validators.maxLength(50)]],
  'emailAddress': [null, [Validators.maxLength(50), Validators.email]],
  'addressChangeReason': this.formBuilder.group({
    'addressChangeReasonId': [null,  [Validators.required, Validators.min(1)]],
    'addressChangeReasonCode': [null, [Validators.required, Validators.maxLength(50)]],
    'addressChangeReasonDescription': [null, [Validators.required, Validators.maxLength(255)]]
  }),
  'addressSource': this.formBuilder.group({
    'sourceOfAddressId': [null, [Validators.required, validatorDropdown]],
    'sourceOfAddressCode': [null, [Validators.required, Validators.maxLength(50)]],
    'sourceOfAddressDescription': [Validators.required, Validators.maxLength(255)]]
  })
});

}

2) 此外，如果需要，我如何只针对 1 个子子项（例如 addressChange Reason）？ 以下不工作

Object.keys(this.editSharedForm.get('addressChangeReason').controls).forEach(key => {
  this.editSharedForm.controls[key].clearValidators();
  this.editSharedForm.controls[key].updateValueAndValidity();
});

“AbstractControl”类型上不存在属性“控件”

Answer 1

因此，如果您想在每个嵌套的 FormControl 上调用 clearValidators 和 updateValueAndValidity，则必须遍历所有嵌套的 FormGroups 和 FormArrays。

正如您在这个快速示例中看到的那样，它非常简单：

clearValidators(formGroup: FormGroup| FormArray): void {
  Object.keys(formGroup.controls).forEach(key => {
    const control = formGroup.controls[key] as FormControl | FormGroup | FormArray;
    if(control instanceof FormControl) {
      console.log(`Clearing Validators of ${key}`);
      control.clearValidators();
      control.updateValueAndValidity()
    } else if(control instanceof FormGroup || control instanceof FormArray) {
      console.log(`control '${key}' is nested group or array. calling clearValidators recursively`);
      this.clearValidators(control);
    } else {
      console.log("ignoring control")
    }
  });

对于问题 2)

只需调用

clearValidators(this.editSharedForm.get('addressChangeReason'))

https://stackblitz.com/edit/angular-dzsrq8