question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

mat-error doesn't show

See original GitHub issue

Bug, feature request, or proposal:

Bug

What is the expected behavior?

mat-error should show

What is the current behavior?

mat-error doesn’t show

What are the steps to reproduce?

 <mat-form-field>
            <input name="address" #address="ngModel" [(ngModel)]="ethernet.address" matInput placeholder="Static IP Address">
            <mat-error *ngIf="!(ethernet.address | ValidateIP)">
              Invalid IP Address
            </mat-error>
 </mat-form-field>

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Is there anything else we should know?

Angular 5.2.9

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:12 (1 by maintainers)

github_iconTop GitHub Comments

14reactions
kylecordescommented, Jun 26, 2018

I realize the current behavior is not considered a bug, but I did find it surprisingly inconvenient and unexpected. There are many cases where the user will benefit from seeing a validation error immediately while still typing a value into a field; to do that, following the documentation, I have to write a custom error matcher. Of course this is easy to do, but it also seems like a long way around the block for what could be a trivial switch. So I guess this is also a feature request to improve the developer ergonomics around choosing between different common ways of using a mat-error.

12reactions
josephperrottcommented, May 31, 2018

Closing as this is working as expected. The mat-error element only becomes visible through the form field control failing validation.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why mat-error not get displayed inside mat-form field in ...
Yes, mat-error does not show up by default. It only shows when the input is touched . But, luckily you can override this...
Read more >
handle many mat-error(s) in the same mat-form-field ... - ITNEXT
One way is to create a function that returns only the first error message of the given control and use only one mat-error...
Read more >
Form field - Angular Material
Error messages can be shown under the form field underline by adding mat-error elements inside the form field. Errors are hidden initially and...
Read more >
Angular – Why mat-error not get displayed inside mat-form ...
Yes, mat-error does not show up by default. It only shows when the input is touched . But, luckily you can override this...
Read more >
Angular Material Form Validation For Beginners - Daniel Kreider
What about displaying an error message for a custom validator? How do you validate an Angular form ... My experience has been that...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found