How to inclue 2 validators in the same formbuilder using angular8 reactive forms

Question

one is password and the other one is account number, both of them have each input extra as confirm password and confirm account number. I have used reactive forms and is as follows:

TS:

private initAchForm() {
      this.achInfoForm = this.FB.group({
        password: ['',Validators.required],
        confirmpassword: ['',Validators.required],
        accountNumber: [null,Validators.required],
        reAccountNumber: [null,Validators.required],
      },
      { validator: ConfirmRoutingValidator.MatchPassword});
  }

have created one file which contains these custom things:

password match file;

import { AbstractControl } from '@angular/forms';
export class ConfirmPasswordValidator {
  static MatchPassword(control: AbstractControl) {
    let password = control.get('password').value;
    let confirmPassword = control.get('confirmPassword').value;
    if (password != confirmPassword) {
      control.get('confirmPassword').setErrors({ ConfirmPassword: true });
    }
    else {
      return null;
    }
  }
}

export class ConfirmAccountValidator {
  static MatchPassword(control: AbstractControl) {
    let password = control.get('accountNumber').value;
    let confirmPassword = control.get('reAccountNumber').value;
    if (password != confirmPassword) {
      control.get('reAccountNumber').setErrors({ ConfirmPassword: true });
    }
    else {
      return null;
    }
  }
}

I am trying to add 2 validators in one section, like { validator: ConfirmRoutingValidator.MatchPassword}, { validator: ConfirmAccountValidator.MatchPassword} but get an error as Expected 1-2 arguments, but got 3.

How can this be solved? I tried adding these values in the control names but it says value of undefined because it is not able to get those values.

Michał Tkaczyk · Accepted Answer · 2020-05-20 13:02:17Z

1

Try to provide them in array, i.e.:

password: ['', [Validators.required, yourCustomValidator]]

answered May 20, 2020 at 13:02

Michał Tkaczyk

7346 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Bhrungarajni Over a year ago

thanks for response i tried this as well but it throws error as value is undefined

Michał Tkaczyk Over a year ago

ok, so maybe try to use Validators.compose() and put this array as it's parameter

Bhrungarajni Over a year ago

reRoutingNumber: ['',Validators.compose([Validators.required,ConfirmRoutingValidator.MatchPassword])],

Bhrungarajni Over a year ago

something like that?

Michał Tkaczyk Over a year ago

@Bhrungarajni finally I've found why you're getting value of null error, your declaration has field named resetpassword, but in your validator you're using resetPassword with uppercase P and that's why it doesn't see this control value

|

Collectives™ on Stack Overflow

How to inclue 2 validators in the same formbuilder using angular8 reactive forms

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related