title: How can i prevent focus on input?
body: <p>Im trying to make <code>input</code> in angular-material2. How can i prevent <code>focus</code> on <code>input</code> if i press <em>visibility button</em>?</p>
  
  <p>Here you can see how it works: <a href="https://material.angular.io/components/form-field/overview#prefix-amp-suffix" rel="nofollow noreferrer">material.angular.io</a></p>
  
  <p>Before pressing the button<br>
  <a href="https://i.stack.imgur.com/5SmKv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5SmKv.png" alt="Before pressing the button"></a></p>
  
  <p>After pressing the button<br>
  <a href="https://i.stack.imgur.com/mC3nW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mC3nW.png" alt="After pressing the button"></a></p>
  
  <pre><code>  &lt;mat-form-field&gt;
      &lt;input
        #mPswd
        matInput
        type="password"
        placeholder="Ваш мастер-пароль"
        [type]="hide ? 'password' : 'text'"
      &gt;
      &lt;mat-icon
        class="unselectable"
        matSuffix
        (click)="hide = !hide"
      &gt;
        {{hide ? 'visibility' : 'visibility_off'}}
      &lt;/mat-icon&gt;
    &lt;/mat-form-field&gt;
  </code></pre>