Generic input-container

[mbeckenbach]

Bug, feature request, or proposal:

feature request

What is the expected behavior?

There should be something similar to the md-input-container which does not depend on a input control inside, so that the benefits for styling error states, using md-error and md-hint can easily be used for custom form controls.

What is the current behavior?

md-input-container has a very limited support for form-controls.

What are the steps to reproduce?

Read the docs :-)

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

When using md-input-container it's really easy to have those nice animated md-error hints and invalid highlight. It's not that easy to get angular to adding the ng-invalid, ng-dirty and so on classes to a parent element like the md-input-container. So creating a similar look and feel for custom controls can be hard.

It would be very cool to use md-input-container for anything.

<md-input-container>
    <my-cool-control mdInput></my-cool-control>
   <md-error>User did something wrong</md-error>
</md-input-container>

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

ng 4.1.x, md beta 5

Is there anything else we should know?

[jelbourn]

@mmalerba I know we planned to support this when designing the input container- what's the status on this?

[mmalerba]

Haven't gotten time to work on it yet, but its a feature I'd love to add

[natsid]

Is the idea for md-input-container to be able to contain all (or most?) of the other Material form controls so that they can all utilize md-hint and md-error, etc.?

[jelbourn]

This issue is tracking the ability to do something like

<md-input-container>
  <my-custom-input mdInput></my-custom-input>
</md-input-container>

(as opposed to always having to be an <input> element)

There's a separate issue of having md-select and md-input-container share the same setup

[natsid]

Ah, I missed the mdInput on the custom tag - thought it was just any custom component. Thanks.

[mmalerba]

This is now available, see the guide: https://material.angular.io/guide/creating-a-custom-form-field-control

[angular-automatic-lock-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.}