angular - 我怎样才能防止专注于输入？

Question

我正在尝试在 angular-material2 中进行 input。如果我按下可见性按钮，如何防止焦点在输入上？

在这里你可以看到它是如何工作的:material.angular.io

按下按钮之前

按下按钮后

  <mat-form-field>
    <input
      #mPswd
      matInput
      type="password"
      placeholder="Ваш мастер-пароль"
      [type]="hide ? 'password' : 'text'"
    >
    <mat-icon
      class="unselectable"
      matSuffix
      (click)="hide = !hide"
    >
      {{hide ? 'visibility' : 'visibility_off'}}
    </mat-icon>
  </mat-form-field>

Answer 1

使用stopPropagation当你点击图标时

// component.html
<mat-icon class="unselectable" matSuffix (click)="onIconClick($event)"></mat-icon>

// component.ts
onIconClick(event){
    event.stopPropagation();
    this.hide = !this.hide;
}