title: Angular Reactive Forms form control valueChanges stops listening on error
body: <p>I have a registration form where I am using <code>valueChanges</code> listener on a form control and makes call to http service that posts to server if this value already exists, e.g. email and user name. If the value exists already on the server, then a status code 403 is returned. I am catching and handling this error by presenting a message to the user, but my problem is the <code>valueChanges</code> listener stops listening, so if I just change the form value, then this code is idle. Can I get the listener to continue even after the error? Should I be handling this another way? Thank you.</p>
  
  <p>Here is listener code:</p>
  
  <pre><code>    this.watchEmailSub = this.registerForm.controls.email.valueChanges.pipe(
        debounceTime(500),
        distinctUntilChanged(),
        switchMap(v =&gt;
          this.regService.checkRegistrationValueExists('Email', v, this.registerForm.controls.email.valid)
        )
      ).subscribe(returnValue =&gt; {
          this.registerEmailError = null;
          console.log('returnValue.message = ', returnValue.message);
        },
        (error) =&gt; {
          console.warn('Error = ', error);
          this.registerEmailError = 'This email already exists';
        }
      );
  </code></pre>
  
  <p>HTTP service code:</p>
  
  <pre><code>  checkRegistrationValueExists(type: string, value: string, formControlValid: boolean): Observable&lt;any&gt; {
      // Code removed here that defines checkValueExistsUrl &amp; checkValueExistsBody
      if (formControlValid) {
        return this.http.post&lt;string&gt;(checkValueExistsUrl, checkValueExistsBody);
      }
      return of({ message: `${type} invalid` });
    }
  </code></pre>