Xavier
Xavier

Reputation: 103

Angular 2 Validator errors

I'm trying to verify the password is long enough but it sends this error. I'm verifying the same way for my emails and I don't have any problems ..

ngOnInit() {
    this.registerForm = this.fb.group({
       username: ['', Validators.required],
       email: ['', [Validators.required,
           Validators.pattern('[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$')]],
        password: ['', Validators.required, Validators.minLength(4)],
        confirmpwd: ['', Validators.required, Validators.minLength(4)],
        birthday: ['', Validators.required]
    });
  }

ERROR Error: Expected validator to return Promise or Observable.

<div *ngIf="password.invalid && password.touched">
          <p *ngIf="password.errors?.required">
               Choose a password
          </p>
          <p *ngIf="password.errors?.minlength">
               The password is too short
          </p>
</div>

Upvotes: 1

Views: 63

Answers (1)

DeborahK
DeborahK

Reputation: 60518

Change this:

password: ['', Validators.required, Validators.minLength(4)],

To this:

password: ['', [Validators.required, Validators.minLength(4)]],

Add the validators to an array.

  • The first element in the array is the default.
  • The second element of the array is a single validator OR an array of validators.
  • The third element of the array is a single async validator or an array of async validators.

So the second validator you listed is being handled as an async validator.

You'll need to make this change to the other formControls as well. (The email is actually correct.)

Upvotes: 2

Related Questions