Angular – 动态添加/删除验证器

我有一个FormGroup定义如下：

this.businessFormGroup: this.fb.group({
    'businessType': ['',Validators.required],'description': ['',Validators.compose([Validators.required,Validators.maxLength(200)])],'income': ['']
  })

现在当businessType为Other时,我想从描述中删除Validators.required验证器.如果businessType不是Other,我想添加回Validators.required.

我使用以下代码动态添加/删除Validators.required.但是,它会清除现有的Validators.maxLength验证程序.

if(this.businessFormGroup.get('businessType').value !== 'Other'){
    this.businessFormGroup.get('description').validator = <any>Validators.compose([Validators.required]);               
} else {                
    this.businessFormGroup.get('description').clearValidators();               
}

this.businessFormGroup.get('description').updateValueAndValidity();

我的问题是,在添加/删除所需的验证器时,如何保留现有的验证器.

解决方法

Angular表单具有内置函数 setValidators(),可以对Validators进行编程分配.

对于您的示例,您可以：

if(this.businessFormGroup.get('businessType').value !== 'Other'){
    this.businessFormGroup.controls['description'].setValidators([Validators.required,Validators.maxLength(200)]);              
} else {                
    this.businessFormGroup.controls['description'].setValidators([Validators.maxLength(200)]);               
}

重要的是要记住,通过使用此方法,您将覆盖现有的验证器,因此您需要包含您正在重置的控件所需的所有验证器.