Angular 模型驱动表单：在 'setValidators()' 中设置自定义验证器

Question

这是一个小问题，但它困扰着我。

我有一个场景，我从表单外部获取一个值(假设一个布尔值)，这意味着它不是表单组的一部分。基于该值，我想设置一个自定义验证器，因为它不适用于可用的验证器(required，pattern...这是一个非常简化的代码来展示： 所以问题很容易设置一个必需的验证器，如下所示：

if(bool) {
this.myForm.get('field').setValidators([Validators.required])
this.myForm.get('field').updateValueAndValidity();
} else ....

我想要一种方法来设置自定义验证错误。所以像这样：

this.myForm.get('field').setValidators([{notValid: true}])

但是以上不起作用，但我需要这样做：

this.myForm.get('field').setValidators([this.customValidator])
customValidator(field) {
return {notValid: true}
}

是否可以在一行上设置自定义验证，而不需要customValidator？(或任何其他更好的方法)

我知道，小问题，但它一直困扰着我，代码实际上也比这里更复杂。

附言。我知道我可以这样做，例如使用其中一个可用的验证器将其标记为无效，但如果可能的话，我想要干净的解决方案。

Answer 1

首先，lambda 可以将其转换为单行代码，但需要注意的是，它的返回值不能以{开头，否则它将被视为函数体，因此请像<any>

this.myForm.get('field').setValidators(f => <any>{notValid:true})

其次，如果自定义验证以表单外部的状态为条件，则可以考虑将该布尔检查移动到验证器本身。

.setValidators(f => outsideBoolean ? {notValid:true} : null)

但是当外部布尔值发生变化时，您仍然必须自己跑updateValueAndValidity()。 即使作为跨字段验证器，表单也不会自动更新。

或者，根本不要对该布尔值使用角度/形式。

第三种方法：使用<input type="hidden"并将外部布尔值放入其中，因此它确实参与了表单验证机制。