查找 Reactive Form 子组的错误

Question

我找不到检索反应式子组错误的方法。

private setupFormValidation() {
    this.progressForm = new FormGroup({
      'preImplementationGroup': new FormGroup({
        'otherProgramName': new FormControl(null, [Validators.required]),
        'programType': new FormControl(null, [Validators.required]),
        ...
      }),
      'testingReviewGroup': new FormGroup({
        ...
      })
    });

仅查找 'preImplementationGroup' 表单组的所有错误的最佳方法是什么？

Answer 1

我找到了一种方法，以防有人在寻找类似的东西：

    sign() {
    var preImplementationGroup = <FormGroup>this.progressService.progressForm.get('preImplementationGroup');
    this.getFormValidationErrors(preImplementationGroup);
  }
  
  getFormValidationErrors(fg: FormGroup) {
    Object.keys(fg.controls).forEach(key => {

      const controlErrors: ValidationErrors = fg.get(key).errors;
      if (controlErrors != null) {
        Object.keys(controlErrors).forEach(keyError => {
          console.log('Key control: ' + key + ', keyError: ' + keyError + ', err value: ', controlErrors[keyError]);
        });
      }
    });
  }

Answer 2

您可以使用 FormBuilder 来构建您的表单组：

import {FormGroup, FormBuilder, Validators, FormControl} from "@angular/forms";
progressForm : FormGroup;
constructor(fb: FormBuilder) {}
private setupFormValidation() {
    this.progressForm = fb.group({
      'preImplementationGroup' :  fb.group({
        otherProgramName: [null, [Validators.required]],
        programType: [null, [Validators.required]]
      }),
      'testingReviewGroup' : fb.group({
        organisme: [null,[Validators.required]],
      })
});
}

查找 Reactive Form 子组的错误

Finding errors of Reactive Form subgroup

angular2-forms

angular