Skip to content

Instantly share code, notes, and snippets.

@kazz12211
Last active October 23, 2019 00:39
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save kazz12211/8361ced4b5b3b76747d07d711b13c79c to your computer and use it in GitHub Desktop.
ログイン画面でブラウザのパスワードマネージャーが記録したパスワードを使わないようにする方法 - Angular Material

input要素に以下の属性を設定する。

  • readonly
  • onfocus="this.removeAttribute('readonly');"
  • autocomplete="off"
<mat-card class="login-panel">
  <mat-card-header>
    <mat-card-title>ログイン</mat-card-title>
  </mat-card-header>
  <mat-card-content>
    <form class="login-form">
      <mat-form-field class="login-fields">
        <input matInput [formControl]="username" placeholder="メールアドレス" type="email" required>
      </mat-form-field>
      <mat-form-field class="login-fields">
        <input matInput [formControl]="password" placeholder="パスワード" type="password" required readonly onfocus="this.removeAttribute('readonly');" autocomplete="off">
      </mat-form-field>
    </form>
  </mat-card-content>
  <mat-card-actions align="center">
    <button (click)="loginUser()" mat-raised-button color="primary">ログイン</button>
  </mat-card-actions>
</mat-card>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment