Allow to customize when md-error is shown

[coder925]

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

I would like to be able to customize when the md-error directive is visible. E.g. when ctrl.dirty && ctrl.invalid.

What is the current behavior?

As per #3560 my understanding is that the md-error is only shown when the control is: (isInvalid && (isTouched || isSubmitted))

What are the steps to reproduce?

See my Plunker.

• Name1 is using md-error. Error will only show after control been touched.
• Name2 is using an old workaround with md-hint. It can show error directly when dirty.

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

For 99% of the time I believe the current implementation is the best behavior.

However, for special cases, you will need to be able to modify when errors are shown. For example instantly as the example from the Angular documentation.

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

Angular v4.0.3 Material v2.0.0-beta.3

Is there anything else we should know?

I assume my request is not currently possible as my question on StackOverflow did not get any suggested answers.

[HopScotch47]

Instead of configuring the whole behaviour to trigger a special case, you could simply do this:

const ctrl = this.form.controls['ctrlName'];
ctrl.markAsTouched();

for the control in question. This at least is what I do in such cases.

[jelbourn]

@kara might also have some thoughts on this

[willshowell]

@jelbourn, since you labeled #4750 as needing discussion, I'd like to illustrate my motivation for pushing for the change. In this plunker you can see that validation must be performed at a group level since the password and confirm controls are dependent on one another. Per @kara's suggestion, this is the best (if not only) way to achieve sibling validation.

Two workarounds must be put into place to emulate the correct behavior:

1. class.mat-input-invalid must be bound to a custom error state matcher
2. An <md-hint> must be styled like an <md-error>, thus losing entrance animations, and you must also bind it to the custom error state matcher with *ngIf

I recognize that this should be reused in md-select, but I'd hate to have to wait until https://github.com/angular/material2/issues/4672, when the tiny amount of logic could be copied as soon as #4754 lands. Would a typescript mixin work for this?

[jelbourn]

I agree that, conceptually, you should be able to change when the error shows. I'm just not sure this is a good way to go about doing that customization. Having it as an input on the control means that there's no good way to configure the behavior app-wide, which I think would be important.

[willshowell]

Dang, had not considered global config and I agree

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}