FormGroup asyncValidator 没有被调用？

Question

我已经研究这个问题很长时间了，我在 SO 上发现了几个问题，但是 none 帮助我解决了这个问题。这是最接近的问题。我正在尝试为 formGroup 调用 asyncValidator，但我无法让它工作。任何帮助将不胜感激，

在下面的代码中，甚至没有触发 http 请求，

这是我的 formGroup,

 const partners = this.formBuilder.array([]);
    this.patientRestrationForm = this.formBuilder.group(
      {
        patientFileId: new FormControl(null),
        firstName: new FormControl(null, Validators.required),
        secondName: new FormControl(null, Validators.required),
        lastName: new FormControl(null, Validators.required),
        aliasName: new FormControl(null),
        patientDob: new FormControl(null, Validators.required),
        patientEmail: new FormControl(null, [Validators.email, Validators.required]),
        socialSecurityNo: new FormControl(null),
        passportNo: new FormControl(null),
        countryCodeId: new FormControl(null),
        patientMobileNo: new FormControl(null),
        partners: partners,
      },
      {
         asyncValidator: (control: AbstractControl) => {
      return this.asyncValidator.bind(control)
    }

      });

这是asyncValidator

 asyncValidator(control: AbstractControl): Promise<any> | Observable<any> {
    const patientFileId = control.get('patientFileId');
    const countryCodeId = control.get('countryCodeId');
    const patientMobileNo = control.get('patientMobileNo');
    const patientEmail = control.get('patientEmail');
    if (patientEmail.value) {
      return this.asyncValidationService.validateEmailNotTaken(patientEmail, patientFileId)
    }
  }

还有我的服务，

public validateEmailNotTaken(a: AbstractControl, b?): Observable<{ [key: string]: any }>  {
    console.log('called::', a.value);
    return this.httpService.getRequest(
      'PatientsRegistration/IsPatientEmailExist' + '?control=' + a.value + '&id=' + b.value,
    ).map((response: HttpResponse<boolean>) => {
      return !response.body ? null : { asyncInvalid: true };
    });
  }

更新，

 <form [formGroup]="patientRestrationForm" autocomplete="off" autocomplete="nope"
    (ngSubmit)="onSubmit()">

最小产品是 here

Answer 1

验证器必须 linked 到一个字段，你的 asyncValidator 不会 link 到你表单中的一个字段，这就是它从未被调用的原因（见 Angular - Form Validation).

你的异步验证逻辑依赖于多个字段，我认为你应该在提交事件上设置这个逻辑，这样你就可以确保所有属性都已设置（如果你使用 Validators.required 将它们设置为必需）并且如果整个表单有效，您将能够提出请求以了解（因为此验证器不会 link 到单个字段）。

解决方案是删除此 asyncValidator 并将其逻辑放入您的提交方法中，如果请求未验证表单内容，则将错误标志设置为 true。

旁注：return this.asyncValidator.bind(control) 不起作用，绑定到控件将导致 this 成为控件，其中 asyncValidationService 未定义。你不应该在这里使用绑定。

FormGroup asyncValidator 没有被调用？

FormGroup asyncValidator is not being called?

angular-validation

angular

更新，