所以我有一个表单,其中仅当另一个控件有值时才需要一个控件,为此我创建了以下结构
profileGroup = this.fb.group({
username: [''],
address: [
'',
[
(control: AbstractControl) => {
if (this.profileGroup?.get('username')?.value) {
return (Validators.required)(control);
}
return (Validators.nullValidator)(control);
},
],
],
Run Code Online (Sandbox Code Playgroud)
});
这个函数效果很好,一旦username 控件获得一个值,aValidators.required就会添加到address控件中。但是,尽管添加了验证器,但控件的有效性address并未更新,因此控件仍标记为valid。
如果可能的话我想避免使用类似的东西
this.profileGroup.get('username')?.valueChanges.subscribe(val=>{
this.profileGroup.get('address')?.updateValueAndValidity()
})
Run Code Online (Sandbox Code Playgroud)
因为可能存在我不知道名称的动态控件,并且不想为每个控件设置一个可观察对象。
这是一个工作示例的堆栈闪电战 https://stackblitz.com/edit/angular-10-formbuilder-example-m8qjq8?file=src/app/app.component.ts
formbuilder angular-validation angular angular-reactive-forms angular-validator