javascript - 我无法访问我的异步验证器，因为它位于 "__zone_symbol"对象中

Question

我已经制作了这个异步验证器

export class PasswordsValidators{
    static oldPasswordMatch(control: AbstractControl) : Promise<ValidationErrors> | null {
        return new Promise((resolve) => {
            if(control.value !== "1234")
                resolve({oldPasswordInvalid:true})
            else
                resolve(null); 
        });
    }
}

但无法获取 oldPasswordInvalid 变量，因为它位于某个对象 __zone_symbol__value 中，如下所示。

这是表单组

  form = new FormGroup({
    oldPassword: new FormControl("",[
      Validators.required,
      PasswordsValidators.oldPasswordMatch
    ]),
    newPassword: new FormControl("",[
      Validators.required      
    ]),
    confirmPassword: new FormControl("",[
      Validators.required      
    ])
  })

这是前端

  <div class="form-group">
    <label>Old Password</label>
    <input 
    formControlName="oldPassword"
    type="password" 
    class="form-control" 
    placeholder="Password">
    <div class="alert alert-danger" *ngIf="oldPassword.invalid && oldPassword.touched">
      <p *ngIf="oldPassword.errors.required"> Should be filled </p>
      <p *ngIf="oldPassword.errors.oldPasswordInvalid">Didn't match</p>
    </div>
  </div>

有人可以解释一下，我在这里缺少什么吗？

Answer 1

问题是您将异步验证器与同步验证器一起传递。解决办法如下:

form = new FormGroup({
    oldPassword: new FormControl("",
      [Validators.required],
      [PasswordsValidators.oldPasswordMatch] // note that async validators are passed as the third parameter
    ),
    newPassword: new FormControl("",[
      Validators.required      
    ]),
    confirmPassword: new FormControl("",[
      Validators.required      
    ])
  })