Angular ReactiveForms - 如何将验证器设置为整个 FormGroup答案

【问题标题】：Angular ReactiveForms - How to set validators to whole FormGroupAngular ReactiveForms - 如何将验证器设置为整个 FormGroup
【发布时间】：2020-06-16 06:41:18
【问题描述】：

我目前有一个非常大的表格。

我对每个字段都有以下验证器，例如：

this.surname = new FormControl('', [
      Validators.pattern(/^([a-zA-Z0-9]+[_.\- /\\]{0,1})*([a-zA-Z0-9]+)$/i),
      Validators.minLength(3),
      Validators.maxLength(30),
      Validators.required
    ]);

每个字段都一样。是否可以不重复代码并对每个人应用相同的规则？我刚试过：

formGroupName.setValidators([Validators.required]);

但不幸的是它不起作用。

【问题讨论】：

标签： angular typescript angular-reactive-forms

【解决方案1】：

你可以：

1.-使用辅助变量

const validators=[
      Validators.pattern(/^([a-zA-Z0-9]+[_.\- /\\]{0,1})*([a-zA-Z0-9]+)$/i),
      Validators.minLength(3),
      Validators.maxLength(30),
      Validators.required
    ]
this.surname = new FormControl('',validators)

2.-使用 setValidator 遍历控件

Object.keys(this.form).forEach(key=>{
     this.form.get(key).setValidators(Validators.required)
}

【讨论】：

【解决方案2】：

FormGroup 接受验证器作为第二个参数。你可以像这样传递一个同步验证器函数的数组：

试试这个：

 this.form.group({
      lastName: ['', ],
      firstName: ['', ]
    },{
      validator: [Validators.required]
    });

【讨论】：