Angular 具有自定义表单级验证和更新 'blur' 选项的反应式表单不起作用

Question

我在合并时遇到问题:

我做了一个简单的 stackblitz 来说明问题：

案例 1：KO

'updateOn' 选项设置为 'blur'。

我们可以看到特定字段验证器（必填/电子邮件）被正确触发，只有当我们松开对输入文本字段的关注时。

但是跨字段全局验证器（检查字段是否相同）没有被触发！

案例 2：正常

'updateOn' 选项未定义。

我们可以看到特定字段验证器（必填/电子邮件）被正确触发，每次输入文本字段中的值发生变化时都是实时的。

并且正确触发了跨字段全局验证器（检查字段是否相同）！

我想我的自定义验证器或我使用它的方式有问题，但我没弄明白为什么...

感谢您的帮助！

Answer 1

如果您查看一下您的 stackblitz，您会发现在您的 buildForm() 和 buildForm2() 中，您正在使用带有签名的 formbuilder.group() 的已弃用重载：

(controlsConfig: { [key: string]: any; }, options: { [key: string]: any; })

你应该使用类型安全的版本：

(controlsConfig: {
    [key: string]: any;
}, options?: AbstractControlOptions)

这在实践中意味着什么？表单的配置部分应该有 validators 而不是 validator （注意复数形式）：

validators: CustomValidator.equalValueValidator("email", "confirmEmail"),

然后一切都会按预期工作，updateOn 将实际用于验证器。

Angular reactive form with custom form-level validator AND updateOn 'blur' option doesn't works