I want to show a div (class alert.alert-danger) under the input field for "OLD PASSWORD" if the old password is not equal to '12345', but it doesn't appear.
My code:
PASSWORD.COMPONENT.TS:
form = new FormGroup({
oldpass: new FormControl(
'',
[Validators.required],
[OldPassValidator.OldPass])
}
PASSWORD.COMPONENT.HTML:
<form [formGroup]="form">
<div class="form-group">
<label for="">Old password</label>
<input type="password" formControlName="oldpass" id="oldpass" class="form-control" [class.redBorder]="oldpass?.touched && oldpass?.invalid">
</div>
<div class="alert alert-danger" *ngIf="oldpass?.touched && oldpass?.errors?.required">
<div *ngIf="oldpass?.touched && oldpass?.errors?.required">Old pass is required</div>
<div *ngIf="oldpass?.errors?.OldPass">Password is not correct</div>
</div>
</form>
VALIDATOR.TS:
static OldPass(control: AbstractControl) : Promise<ValidationErrors | null>
{
return new Promise((resolve, reject) =>
{
if(control.value === '12345')
return resolve({ OldPass: true });
else
return resolve(null);
});
}