我们如何在初始页面加载时动态设置表单数组控件的错误

问题描述

在我的要求之一中，我形成了一个包含行和列的类似数组的网格表。一旦启动，我就进行服务呼叫并获取列和值以及错误消息。基于此，我为该列创建了一个表单数组，并且如果存在errormessage，则每个列都有errormessage，需要设置错误。

我可以为这些列设置值，但在推入表单数组时无法设置错误，我也不知道如何推错误。卡在这条线上。

Qn？ 最初，我们如何根据服务响应错误消息在表单数组控件中设置错误 我仅能看到最初设置值并为该控件设置验证器的演示。

但是对于我来说，我需要设置错误并根据服务器响应设置一个值。

例如）答复

  [
    {fieldName:'productId',fieldValue:'123',errorMessage:'Product Id should be alphanumeric'},{fieldName:'productname',errorMessage:'Product name should be 10 characters'}],

等

onInit(){

//进行服务调用并获取值，一旦获取值将其推入formArray。但是如何也推错误。

值正常工作

let result= service response;

     result.forEach((item:any[],index) => {

 let formData =this.formBuilder.group({
            item.fieldName:[item.fieldValue],item.fieldName:[item.fieldValue]
        
        });
        this.formArr.push(formData);
      
});

}

解决方法

您可以在推送到formArr之前简单地调用formData.setErrors（{errorMessage：item.errorMessage}）。

,

推荐的方法是使用updateValueAndValidity();

formData.updateValueAndValidity();

但是有一些注意事项需要理解。

1. 在单独的formControl级别上可以正常工作。

2. 但是在formGroup和formArray级别，它只会更新其祖先的有效性。 Angular 6,this.formGroup.updateValueAndValidity() not working properly和Angular 6,this.formGroup.updateValueAndValidity() not working properly

   中已经详细介绍了这些内容

3. 解决方法有些奇怪，但是您可以迭代并使它们在这些行上发生。

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