angular/components
在 GitHub 查看[input] Add example of using mat-error with parent formgroup validation
Open
#8,513 创建于 2017年11月17日
P4area: material/form-fielddocsfeaturehelp wanted
仓库指标
- Star
- (24,044 star)
- PR 合并指标
- (平均合并 3天 12小时) (30 天内合并 98 个 PR)
描述
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.