title: multiple custom validators in reactive form angular 2
body: <p>I have two custom <code>validator</code> in a <code>reactive form</code>, I call function below to create form in component constructor:</p>
  
  <pre><code>private createForm(): void {
  this.passwordUpdateForm = this.formBuilder.group({
      newpassword : [null, Validators.required],
      passwordconfirm: [null, Validators.required]
  },
  {
      validator: [PasswordValidation.PasswordMatch, PasswordValidation.PasswordRule] // validation method
  
  });
  </code></pre>
  
  <p>}</p>
  
  <p><strong>PasswordValidation</strong> is a class with two functions like below</p>
  
  <pre><code>    export class PasswordValidation {
  
       public  static PasswordMatch(control: AbstractControl) {
          let password = control.get('newpassword'); // to get value in input tag
          if(password){
              let confirmPassword = control.get('passwordconfirm').value; // to get value in input tag
              if (password.value !== confirmPassword) {
                  control.get('passwordconfirm').setErrors({ ['passwordmatch'] : true});
              }else {
                  return null;
              }
          }
      }
  
      public static PasswordRule(control: AbstractControl) {
          let password = control.get('newpassword').value; // to get value in input tag
          let pattern = new RegExp('^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&amp;*-]).{8,64}');               
          if (!pattern.test(password)) {
              control.get('newpassword').setErrors({ ['passwordrule'] : true});
          }else if (password.toLowerCase() === 'something') {
              control.get('newpassword').setErrors({ ['passwordrule'] : true});
          }else {
              return null;
          }
      }
  }
  </code></pre>
  
  <p>each custom validator works fine separately like this</p>
  
  <pre><code>validator: PasswordValidation.PasswordMatch
  </code></pre>
  
  <p>or this</p>
  
  <pre><code>validator: PasswordValidation.PasswordRule
  </code></pre>
  
  <p>but using both of them in array like </p>
  
  <pre><code>validator: [PasswordValidation.PasswordMatch, PasswordValidation.PasswordRule]
  </code></pre>
  
  <p>get error <code>this.validator is not a function</code> and does not work, I do not have any idea, please help.</p>