javascript - 通过 Angular 6 将一个验证规则应用于所有字段的任何简单方法

Question

考虑一个数据模型包含 20 个具有不同名称(“名称”、“地址”、“公司”等)的字符串字段，映射到 Angular 前端作为 20 个输入字段。现在，要求验证每个字段，如果任何字段包含特殊字符，则会阻止用户提交表单。

我可以计算出正则表达式模式，但只是想知道有什么简单的方法可以对所有字段执行一个验证器。

Answer 1

对此有一个简单的解决方案，例如仅使用一个异步验证器。

例如，您可以将所有字段分组，只要子表单中的一个字段发生更改，我们就应验证这些字段 然后对它们应用验证器。

示例:

this.mySubForm = this.fb.group({
    field1: ['', [Validators.required]],
    field2: ['', [Validators.required]],
    ...
    field20: ['', [Validators.required]]
}, this.validatorAllFields.bind(this)

   });

并以这种方式定义异步验证器:

validatorAllFields(control: FormGroup): any {
  if (control) {
      if(control.value.field1 don't contain special char … &&
         control.value.field2 don't contain special char … &&
         …
         control.value.field20 don't contain special char &&)
         //validation is ok in this case
         return null;
      else
         //validation fails here...
         return {'formInvalid': 'true'}
  } else {
      return null;
    }
  }

您无需任何额外的软件包即可执行此操作，并且它会起作用。只需实现:每个控件没有任何特殊字符，例如它应该是相同的功能。

您可以使用 formGroupName 作为子表单，甚至可以根据需要避免使用子表单。