角反应形式设置并清除验证器

时间:2018-07-12 08:22:34

标签: angular angular-reactive-forms

请协助,我想删除表格中的所有验证器,请告知是否可行,如果您有20个或更多表格组的表格控件,删除验证器的更好方法是什么,请参见下面的示例。 / p>

/etc/apt/trusted.gpg.d

上述方法 ngOnInit() { this.exampleFormGroup = this.formBuilder.group({ surname: ['', [Validators.required, Validators.pattern('^[\\w\\s/-/(/)]{3,50}$')]], initials: ['', [Validators.required, Validators.maxLength(4)]] }); } public removeValidators() { this.exampleFormGroup.get('surname').clearValidators(); this.exampleFormGroup.get('initials').clearValidators(); this.exampleFormGroup.updateValueAndValidity(); } public addValidators() { this.exampleFormGroup .get('surname').setValidators([Validators.required,Validators.pattern('^[\\w\\s/-/(/)]{3,50}$')]); this.exampleFormGroup.get('initials').setValidators([Validators.required, Validators.maxLength(4)]); this.exampleFormGroup.updateValueAndValidity(); } 将添加验证器,而addValidators()将在执行时删除验证器。但是我的问题是,我必须指定试图清除验证器的表单控件。有没有办法只做removeValidators()并清除表单中的所有内容,然后再次this.exampleFormGroup.clearValidators();来重新设置它们。我知道我可能会要求独角兽,但是在formGroup具有20个或更多控件的情况下,清除和设置验证器可能会很痛苦,因此将非常感谢您了解如何处理此类情况的地图。

1 个答案:

答案 0 :(得分:11)

您可以执行以下操作:

validationType = {
'surname': [Validators.required, Validators.pattern('^[\\w\\s/-/(/)]{3,50}$')],
'initials': [Validators.required, Validators.maxLength(4)]
}

ngOnInit() {
    this.exampleFormGroup = this.formBuilder.group({
     surname: ['', [Validators.required, Validators.pattern('^[\\w\\s/-/(/)]{3,50}$')]],
     initials: ['', [Validators.required, Validators.maxLength(4)]]
     });
  }

public removeValidators(form: FormGroup) {
    for (const key in form.controls) {
         form.get(key).clearValidators();
         form.get(key).updateValueAndValidity();
    }
}


public addValidators(form: FormGroup) {
        for (const key in form.controls) {
             form.get(key).setValidators(this.validationType[key]);
             form.get(key).updateValueAndValidity();
        }
}
相关问题