Add md-no-asterisk to inputs

[prowwid]

Bug, feature request, or proposal:

request

What is the current behavior?

There is no ability to remove asterisks from placeholders in inputs with required attribute.

What is the expected behavior?

We need an ability to disable asterisks on required inputs like in the first version of material UI by using "md-no-asterisk" attribute in input.

In the end, it would be good enough to have syntax like in the following example:
Plunker md-no-asterisk example

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

For now, there are two hacks to remove asterisks from inputs:

1. do not use "required" attribute
2. use "required" attribute with hacks that would hide or remove automatically added asterisk

Both options are crutches. And as you know crutches are really bad things.

[mizdler]

I think currently simplest solution is to change mat-placeholder-required CSS class:
.mat-placeholder-required { display: none; }

[prowwid]

Hi, @mizdler

Yes, you are right.
But, as I've already said in the description, it is a hack.

If we do not need asterisk It would be really nice to have the ability to disable asterisk in input without modification of styles.
For example, login credentials - both nickname and password are required but who would mark those fields was asterisks?

[jefersonestevo]

I agree that this option should be available, but I think it may be used as a mdInput @Input() property, like the disableRipple property from md-list.

Something like:
<input type="text" mdInput required ... mdNoAsterisk />

Or it'll be better just to be named noAsterisk ?

If you want I can send a PR with this change.

[ryanp-bitfocus]

In material 1 mdNoAsterisk already existed and worked for this purpose. As seen on the documentation here https://material.angularjs.org/latest/api/directive/mdInput

[mbeckenbach]

@prowwid
Why should one not want to customize CSS in components styles and make usw of view encapsulation?

[M-a-c]

@mbeckenbach I think the idea is you specified something and it changed what you expected, maybe they shouldn't have been rendered in the first place.

https://material.io/guidelines/components/text-fields.html#text-fields-layout the spec says that "In forms with some required fields, indicate all of the required ones. However, if there are fewer optional fields, indicate those instead"

So essentially to get the proper functionality where a form has more optional fields than required fields you have to do something hacky with the styles instead of telling the component to not use the asterisks.

It seems to meet the spec, users should be able to turn off the asterisks.

@jefersonestevo go for the pr see what happens? ¯\(ツ)/¯

[mmalerba]

Talked with @jelbourn, we're up for adding a hideRequiredMarker attribute to md-input-container. Anyone want to take this on?

[M-a-c]

@mmalerba I might be able to, but @jefersonestevo said they could submit a pr.
Is there a component you can point to that has a similar disable option?

[mmalerba]

The required field on MdInputDirective is a good example for how to do a boolean @Input() https://github.com/angular/material2/blob/master/src/lib/input/input-container.ts#L162

[M-a-c]

Awesome thanks!