title: Angular Custom Validator Doesn't Reflect Changes in View
body: <p>I have custom validator like this:</p>
  
  <pre><code>export class PasswordValidator {
      static MatchPassword(AC: AbstractControl) {
          const formGroup = AC.parent;
  
          if(formGroup) {
              let password = formGroup.value.password // to get value in input tag
              let confirmPassword = formGroup.value.confirmPassword; // to get value in input tag
              if(password != confirmPassword) {
                  formGroup.get('confirmPassword').setErrors({ matchPassword: true });
              } else {
                  formGroup.get('confirmPassword').setErrors(null);
              }
              console.log(formGroup.get('confirmPassword').errors);
          } else {
              return null
          }
       }
  }
  </code></pre>
  
  <p>And i have added to the form:</p>
  
  <pre><code>this.registerationForm.addControl("confirmPassword", new FormControl('', Validators.compose([Validators.required, PasswordValidator.MatchPassword])));
  </code></pre>
  
  <p>And in View:</p>
  
  <pre><code>  &lt;ion-item class="error-message" *ngIf="registerationForm.controls.confirmPassword.hasError('matchPassword') 
      &amp;&amp; registerationForm.controls.confirmPassword.touched"&gt;
      &lt;p&gt;Some message*&lt;/p&gt;
    &lt;/ion-item&gt;
  </code></pre>
  
  <p>But the problem is i can see the console window but i don't see it reflects in view. The <code>ngIf</code> condition isn't showing the error message</p>