我需要为FormGroup分配一个自定义验证器。我可以在创建FormGroup时这样做:
let myForm : FormGroup;
myForm = this.formBuilder.group({
myControl1: defaultValue,
myControl2: defaultValue
}, { validator: this.comparisonValidator })
comparisonValidator(g: FormGroup) {
if (g.get('myControl1').value > g.get('myControl2'.value)) {
g.controls['myControl1'].setErrors({ 'value2GreaterThanValue1': true });
return;
}
}
但是我遇到了一种情况,我需要在示例化FormGroup * 之后 * 添加自定义验证器,所以我尝试在示例化myForm
之后添加验证器,而不是在示例化表单时添加验证器:
let myForm : FormGroup;
myForm = this.formBuilder.group({
myControl1: defaultValue,
myControl2: defaultValue
})
this.myForm.validator = this.comparisonValidator;
这给了我一个编译器错误:
Type '(g: FormGroup) => void' is not assignable to type 'ValidatorFn'.
Type 'void' is not assignable to type 'ValidationErrors'.
如何为FormGroup
分配验证器,以便formGroup
作为参数传递给comparisonValidator
函数?
更新-我添加了一行代码来显示我在comparisonValidator
中执行setErrors
的位置,以使我更清楚地尝试如何设置验证错误。
5条答案
按热度按时间zengzsys1#
我创建了一个stackblitz,请看。
在组件.ts文件中
在component.html文件中
aemubtdh2#
要在示例化formGroup之后设置任何验证器(预定义的或自定义的),您需要使用FormGroup的**setValidators()**方法。例如:
q3qa4bjr3#
感谢@Anuradha Gunasekara -他的回答是最正确和完整的解决方案。我的错误的“快速修复”是在验证器上添加一个
any
返回类型。我仍然可以将自定义验证器赋值给FormGroup
,并且FormGroup
将作为参数隐式传递给我的自定义验证器。下面的代码将工作:osh3o9ms4#
从窗体组中删除所有窗体控件白色
自定义验证器:
组件:
ecfdbz9o5#
这些答案对我不起作用,因为我还有其他的验证器。在我的用例中,我必须为相反的字段设置错误。
也许它并不完全符合OP的要求,但它希望能帮助其他人(像我一样),降落在这个网站上。
这里是我的解决方案,它可以安全地与其他验证器组合,并确保相反的字段得到更新。