I work on angular 7
I compare between old password and new password
if two both are same then error must display
but in my case old password and new password are same but error not display
why error not display and How to solve this problem ?
function CompareOldWithNew return false when both old and new are same value but error not display
changepassword.ts
oldPassword = new FormControl('', [Validators.required, Validators.minLength(6), Validators.maxLength(10)]);
newPass = new FormControl('', [Validators.required, Validators.minLength(6), Validators.maxLength(10),this.CompareOldWithNew("oldPassword")]);
ngOnInit() {
this.createFormResetPassword();
}
get c() { return this.ChangePasswordForm.controls; }
CompareOldWithNew(field_name): ValidatorFn {
return (control: AbstractControl): { [key: string]: any } => {
const input = control.value;
const isnotequalValues = control.root.value[field_name] != input;
return isnotequalValues ? null :{'old password must not match New': {isnotequalValues}} ;
};
}
createFormResetPassword() {
this.ChangePasswordForm = this.formBuilder.group({
oldPassword: this.oldPassword,
newPass: this.newPass
})
}
onSubmit() {
if (this.ChangePasswordForm.invalid) {
return;
}
changpaassword.html
<div class="form-group">
<label >OldPassword</label><br>
<input type="password" formControlName="oldPassword" class="textboxclass" [ngClass]="{ 'is-invalid': submitted && c.oldPassword.errors }" />
<div *ngIf="submitted && c.oldPassword.errors" class="invalid-feedback">
<div *ngIf="c.oldPassword.errors.required">Password is required</div>
<div *ngIf="c.oldPassword.errors.minlength">Password must be at least 6 characters</div>
</div>
</div>
<div class="form-group">
<label>New Password</label><br>
<input type="password" formControlName="newPass" class="textboxclass" [ngClass]="{ 'is-invalid': submitted && c.newPass.errors }" />
<div *ngIf="submitted && c.newPass.errors" class="invalid-feedback">
<div *ngIf="c.newPass.errors.required">Password is required</div>
<div *ngIf="c.newPass.errors.minlength">Password must be at least 6 characters</div>
<div *ngIf="c.newPass.errors.CompareOldWithNew">old password not match new </div>
</div>
</div>
This will check for not equal input
new FormControl('', notEqual('xxx'))
Validator
import { AbstractControl, Validators, ValidatorFn } from '@angular/forms';
import { isPresent } from '../util/lang';
export const notEqual = (val: any): ValidatorFn => {
return (control: AbstractControl): {[key: string]: boolean} => {
if (isPresent(Validators.required(control))) return null;
let v: any = control.value;
return val !== v ? null : {notEqual: true};
};
};