title: Search input with icon before placeholder text - Material Design
body: <p>Code is below. Currently the placeholder text overlaps the icon. I need the placeholder text indented to the right of the icon. Perhaps there is a better way to include an icon and placeholder text in a matInput element?</p>
  
  <pre><code>&lt;mat-form-field&gt;
      &lt;mat-icon fontSet="myfont"
          fontIcon="my-icon-search"
          class="search-icon"&gt;&lt;/mat-icon&gt;
      &lt;input id="app_search_input"
          matInput
          type="search"
          placeholder="{{'common.search' | translate}}"
          class="search-input"&gt;
  &lt;/mat-form-field&gt;
  </code></pre>