title: Angular 6 - Validators pattern not working
body: <p>I am using a reactive form in angular 6, and trying to do some validation on a password field. Basically it needs to be more than 8 characters, contain at least 1 upper case, and contain at least 1 symbol.</p>
  
  <p>my regex which I have tested, is <code>^(?=.*[A-Z])(?=.*[!@#\$%\^&amp;\*])(?=.{9,})</code></p>
  
  <p>Here is an excerpt from my login component ts:</p>
  
  <pre><code>  ngOnInit() {
          this.loginForm = this.formBuilder.group({
              userName: ['Username', [Validators.required]],
              password: ['Password', [Validators.pattern("^(?=.*[A-Z])(?=.*[!@#\$%\^&amp;\*])(?=.{9,})")]]            
          });
      }
  </code></pre>
  
  <p>Here is my form group div:</p>
  
  <pre><code> &lt;div class="form-group"&gt;
                        &lt;input type="password" formControlName="password" class="form-control" [ngClass]="{ 'is-invalid': submitted &amp;&amp; f.password.errors }" /&gt;
                        &lt;div *ngIf="submitted &amp;&amp; f.password.errors" class="invalid-feedback"&gt;              
                            &lt;div *ngIf="f.password.errors.pattern"&gt;Password must contain more than 8 characters, 1 upper case letter, and 1 special character&lt;/div&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
  </code></pre>
  
  <p>Basically the password does not validate even if it appears to be correct. Any tips would be appreciated.</p>