I am using the validations of the reactive forms in the angle, I put a valid email validation, the problem is that while the user is still typing the email already appears. I would like to know how to just show the error message after losing focus on the email field.
Currently my code is this:
HTML
<mat-form-field class="full-width">
<input [errorStateMatcher]="matcher" required formControlName="email" matInput placeholder="Email">
<mat-error>
Você precisa entrar com um e-mail válido.
</mat-error>
</mat-form-field>
TS:
this.formularioLogin = this.fb.group({
email: ['', Validators.compose([Validators.required, Validators.email])],
password: ['', Validators.compose([Validators.required])],
});
ErrorStateMatcher:
export class MyErrorStateMatcher implements ErrorStateMatcher {
isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {
const isSubmitted = form && form.submitted;
return !!(control && control.invalid && (control.dirty || control.touched || isSubmitted));
}
}