Angular 反應式表單驗證嚴重錯誤

Question

我正在使用 angular 反應式 forms 在我的應用程序中構建一個表單。 我已將驗證添加到表單中。 表格真的很簡單：

  ngOnInit() {
     this.form = this.fb.group({
        minQty: ['', Validators.required],
        maxQty: ['', Validators.required]
     });

     this.form.valueChanges.subscribe(val => this.changeFn(val));
}

應用了必需的驗證器。 我意識到，表單組 object 是無效的，但錯誤屬性沒有填充來自控件本身的錯誤。 我不知道這是預期的行為還是只是出了點問題。

所以我在控制台中看到：

• console.log(this.form.status) -> 無效
• 控制台日志（this.form.errors）-> null
• console.log(this.form.get('minQty').errors) -> {required: true}

在這種情況下， this.form.errors是否應該包含聚合錯誤 object，以及所有子控件錯誤？

更新：

剛剛做了一個 function ，它匯總了整個表單的錯誤。 我沒有用 FormArray 測試它。

  public aggregateErrors(form: FormGroup | FormArray, errors: ValidationErrors): void {
     Object.keys(form.controls).forEach((key: string) => {
        const abstractControl = form.controls[key];

        if (abstractControl instanceof FormGroup || abstractControl instanceof FormArray) {
            this.aggregateErrors(abstractControl, errors);
        }

        if (abstractControl.errors) {
          errors[key] = abstractControl.errors;
        }
     });
}

Answer 1

錯誤屬於您已對其應用驗證的控件，而不是父控件。

沒有錯誤聚合，但表單組可以有自己的驗證。