CODEWITHSUNDEEP
angularjsangular-material
Aysha Azura
Aysha Azura

Reputation: 179

md-icon not working inside a text field

I am developing an angular material website. Here I want icons before input text field and after the text field. what I did was 

<div layout="row" layout-xs="column" md-whiteframe="1" layout-wrap layout-padding layout-fill class="littleWhiteFrameNoBorder" ng-cloak>
<div layout="row" flex="100">
    <md-input-container flex="40">
        <label>Search Keyword</label>
         <md-icon md-font-icon="search"></md-icon>
        <input ng-model="searchFilterCtrl.word">
    </md-input-container>
    <md-icon md-font-icon="search"></md-icon>
</div>

Spacing was created but I couldn't see any icons before and after text field.

Upvotes: 2

Views: 883

Answers (2)

aysan moradian
aysan moradian

Reputation: 1

hope it solves your problem...

 <md-input-container>
  <md-icon  class="md-warn md-icon-button  md-24" >highlight_off</md-icon>
  <input  type="text"  ng-model="filterText"
    placeholder="search...">
</md-input-container>

Upvotes: 0

Rohan
Rohan

Reputation: 103

Here's a pen click on the dialog button you will see a form I hope it solves the issue or you can just do it this way , Just don't forget to include the stylesheet as mentioned in the comment above.

<md-input-container>
<label>Something</label>
<md-icon class="material-icons">search</md-icon>
<input type="text">
</md-input-container>

Upvotes: 2

Related Questions