角度异步验证器的状态未反映在表单字段的错误状态中

Moo*_*her 2 angular angular-reactive-forms

我在一个字段上有一个异步验证器zip

zip: ['', {
            validators: [
              Validators.required,
              Validators.minLength(5),
              Validators.maxLength(5)
            ],
            asyncValidators: [
              adPostFormValidators.isValidZip(this.locationService)
            ]
          },
      ],
Run Code Online (Sandbox Code Playgroud)

但是,在我单击该字段之外之前,该字段似乎并未反映来自异步验证器的错误。例如,这是在我单击之前(这null是字段的错误状态):

在此输入图像描述

我知道异步验证器已经运行,因为我将其结果输出到控制台:

在此输入图像描述

然后,当我单击或失去焦点时,错误状态现在是准确的:

在此输入图像描述

但是,验证器没有再次运行,因为控制台中没有记录任何新内容。

Moo*_*her 6

所以看来因为我正在使用ChangeDetectionStrategy.OnPush,我必须手动标记异步验证器进行检查:

ref.markForCheck()
return { 'Is not a valid zip': { value: control.value } } as ValidationErrors
Run Code Online (Sandbox Code Playgroud)

其中ref是 类型ChangeDetectorRef