Angular form.statusChanges 不适用于动态表单 + asyncValidation

Question

当动态添加带有 asyncValidation 的新 FormControl 到响应式(Reactive)表单时，表单从 PENDING 变为 VALID/INVALID，但不会触发 statusChanges。

我有一个动态修改的表单，在那之后，我订阅了 statusChanges。我正在打印表单的状态，我可以检查状态是否发生变化，但 stausChanges 未触发。

这是一个例子 https://stackblitz.com/edit/angular-pvebmb?file=src%2Fapp%2Fapp.component.ts .

在此示例中，您可以检查是否订阅了 console.log 以获取 statusChanges。有一个按钮，单击该按钮后，会添加一个新的 FormControl，其中的异步验证需要 1 秒才能完成。您可以检查一下，当您单击按钮时，表单的状态(打印在 html 中)从 PENDING 变为 INVALID，但没有打印与 statusChanges 相关的 console.log。

我希望每次表单的状态值更改时都会触发 statusChanges。

Answer 1

看起来它是按设计完成的。它不会触发状态更改，因为它在初始化(或第一次运行 updateValueAndValidity 时)无效，并且如果您检查 FormControl 的代码，将阻止发出该事件。你可以在这里查看:
https://github.com/angular/angular/blob/8.2.13/packages/forms/src/model.ts#L1275

如您所见，emitEvent是假的。

这并不能真正解决您的问题，但至少可以解释为什么会发生这种情况。在您的示例中，如果您在按下控件后立即将该值设置为空值，您将获得该 statusChange，因为那时 updateValueAndValidity将有 emitEvent设置为真。因此，如果您确实希望在初始化时触发 statusChanges，则变通方法会将 formControl 的 setValue 设置为空。