Estou utilizando as validações dos formulários reativos no angular, coloquei uma validação de e-mail válido, o problema é que enquanto o usuário ainda está digitando o email já aparece o . Gostaria de saber como fazer pra só mostrar a mensagem de erro após perder o foco no campo de e-mail.
Atualmente meu código é esse:
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));
}
}