How to put icon in placeholder in Angular Material? -

i'm trying put icon in placeholder. tried code:

<md-input name="name">    <md-placeholder>       <i class="material-icons app-input-icon">face</i> name    </md-placeholder> </md-input> 

it working (was showing icon placeholder) before reinstalled angular material , updated angular cli. code browser giving error now: "'md-input' not known element".

then tried code:

 <md-input-container>     <input mdinput placeholder="name" name="name2">  </md-input-container> 

it working how can put 'face' icon in placeholder ?

your problem not md-placeholder tag. error said, md-input deprecated. angular material changed md-input tag mdinput directive.

but md-placeholder still working (not sure if last though).

the following code should work :

<md-input-container>     <md-placeholder>         <md-icon>face</md-icon> name     </md-placeholder>     <input mdinput name="name"> </md-input-container> 

an alternative use mdprefix or mdsuffix directives md-icon tag. display icon on left or right of input, won't follow placeholder when click on it.

example :

<md-input-container>     <md-icon mdprefix>face</md-icon>     <input mdinput placeholder="name" name="name"> </md-input-container> 

check api reference more informations.