title: validator to return Promise or Observable : Custom async validator : Angular 8
body: <p>I'm trying to create a custom async validator for my registration form where it checks if an email is a valid email or not using third party API. this is ref link of the API website -</p>
  <p><a href="https://www.zerobounce.net/email-validation-api.html" rel="nofollow noreferrer">https://www.zerobounce.net/email-validation-api.html</a></p>
  <p>I am trying to implement it using RxJs debounceTime, distinctUntilChanged. In the form control I have two more validations required and pattern. But I am always getting this error - <strong>Error: Expected validator to return Promise or Observable.</strong></p>
  <p>I have searched several examples but nothing worked. Thank you in advance.</p>
  <p><strong>Validator -</strong></p>
  <pre><code>export class UniqueEmailValidator{
     static createValidator(_ajaxService : AjaxService){
          return (control : AbstractControl) =&gt;{
              const apiKey = environment.emailValidatationKey;
              const baseUrl = 'https://api.zerobounce.net/v2/validate?';
              if(control.valid){
                  return control
                  .valueChanges
                  .pipe(
                      debounceTime(800),
                      distinctUntilChanged(),
                      switchMap((email : string) =&gt; _ajaxService.apiCall('', `${baseUrl}api_key=${apiKey}&amp;email=${email}&amp;ip_address=''`, 'GET', true)),
                      map(res =&gt; res.json()),
                      map((validationStatus : any) =&gt; {
                          if (
                              validationStatus.status == &quot;valid&quot; &amp;&amp;
                              validationStatus.mx_found == &quot;true&quot;
                          ) {
                              return null
                          } else {
                              return { isEmailInvalid : true }
                          }
                      })
                  )
              }
          }
      }
  }
  </code></pre>
  <p><strong>Register Component -</strong></p>
  <pre><code>this.registration = this._formBuilder.group({
    firstName: new FormControl('', [
      Validators.required,
      Validators.pattern('^[a-z A-Z]+$')
    ]),
    lastName: new FormControl('', [
      Validators.required,
      Validators.pattern('^[a-z A-Z]+$')
    ]),
    email: new FormControl('', [
      Validators.required,
      Validators.pattern('[A-Za-z0-9._%-]+@[A-Za-z0-9._%-]+\\.[a-z]{2,3}')
    ],UniqueEmailValidator.createValidator(this._ajaxService))
  })
  </code></pre>