[input] Add example of using mat-error with parent formgroup validation
#8513 aperta il 17 nov 2017
Metriche repository
- Star
- (24.044 star)
- Metriche merge PR
- (Merge medio 3g 12h) (98 PR mergiate in 30 g)
Descrizione
Bug, feature request, or proposal:
<mat-error> doesn't show when I use an email maching validator for emails inputs.
What is the expected behavior? To display the error.
What is the current behavior? No error is displayed
What are the steps to reproduce?
Set a custom validator for check if two emails inputs are equals, like this :
private matchEmail(AC: AbstractControl) {
return AC.get('mail').value === AC.get('mailconfirm').value ? null : { mailmismatch: true };
}
this.administratifForm = this.fb.group({
(...),
mail: this.fb.control('', [Validators.required, Validators.email]),
mailconfirm: this.fb.control('', [Validators.required]),
(...),
}, {
validator: this.matchEmail,
},
);
The template :
<mat-form-field>
<input matInput placeholder="Vérification d'email" formControlName="mailconfirm">
<mat-error *ngIf="administratifForm.get('mailconfirm').hasError('required')">
Ce champ est requis
</mat-error>
<mat-error *ngIf="administratifForm.hasError('mailmismatch')">
Les adresses mail ne correspondent pas
</mat-error>
</mat-form-field>
Which versions of Angular, Material, OS, TypeScript, browsers are affected? Angular 5.0.2, Material 5.0.0-rc0, MacOS Sierra, Firefox
Additional Information
If i replace the <mat-error> tag by a <p> tag (or anything else), it's work.