Topic: Angular Password Validation
So I'm trying to do very simple password validation. All I want is it to have a minLength of 8. I've basically copy and pasted the example code, however I am still running into issues. No matter what I enter into the password field, it is returning an error. Am I missing something small?
<form [formGroup]="loginForm" (ngSubmit)="login()"> <div class="md-form"> <i class="fa fa-envelope prefix grey-text"></i> <input type="email" id="loginEmail" formControlName="email" class="form-control" data-error="Please format your email correctly." data-success=" " mdbInputDirective> <label for="loginEmail">Email</label> </div> <div class="md-form"> <i class="fa fa-lock prefix grey-text"></i> <input type="password" id="loginPassword" formControlName="password" class="form-control" data-error="Password must be at least 8 characters in length." data-success=" " mdbInputDirective> <label for="loginPassword">Password</label> </div> <div class="text-center"> <input type="submit" class="btn btn-default waves-light" mdbWavesEffect value="Login" [disabled]="!loginForm.valid"> </div> </form> this.loginForm = new FormGroup ({ email: new FormControl(null,[Validators.email, Validators.required]), password: new FormControl(null,[Validators.minLength(8)]) })
Any help is appreciated!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Open
Specification of the issue
- User: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Damian Gemza staff commented 7 years ago
Dear jicee13, data-error and data-success attributes works only with mdbInputDirective validation. If you want a minimum length validation for your password input, you can do it in 2 ways. 1st: use customRegex field to put there your custom regex validation, 2nd: turn off mdbInputDirective validation by using [mdbValidate]="false", and style your validation on your hand. In future we'll add support for data-error and data-success attributes for Angular Validators. Everything is described here: https://mdbootstrap.com/angular/forms/input-validation/ https://mdbootstrap.com/mdbinputdirective/ Best Regards, Damian