当构造时值发生更改时，窗体在异步验证器的作用下停留在PENDING状态

Question

在表单组上使用带有异步验证器的响应式表单时，如果在构造函数中或在ngOnInit中使用patchValue更改表单组的值，即使异步验证器observable完成，表单仍处于PENDING状态。

我在Stacklitz 中创建了一个SSCCE

在该示例中，您看到一个简单的表单，它有两个字段，其中指示表单状态和验证器状态。在代码中，在ngOnInit中，我在表单上调用patchValue，使表单进入PENDING状态，并调用异步验证器。

异步验证器没有做太多工作，它只是等待1秒，然后返回一个null错误对象，基本上表明表单是有效的。您可以在指示中看到验证已完成，但表单仍处于PENDING状态。

如果在构造函数或ngOnInit(即对象构造(之外的任何时间触发字段值的更改，那么在验证器完成时，表单确实会进入VALID状态。如果将值更改包装在setTimeout中，这也适用。

我做错什么了吗？这是正常行为，还是Angular中的错误？

Answer 1

在异步验证器之后，我遇到了类似的问题，表单卡在了PENDING上，我就是这样处理的：
1( 观察状态变化：

this.form$ = this.form.statusChanges;

2( 订阅可观察：

this.form$.subscribe( r => {
if (r === 'VALID') {
//form valid
} else if( r === 'PENDING') {
setTimeout(() => {
this.form.updateValueAndValidity(); // this function will trigger statusChange one more time.
}, 2000);
} else {
// any other status
}
});

所以，如果异步验证器完成了，但没有触发状态更改，那么你所能做的就是自己再触发一次状态更改。