登录框密码加眼睛

src/app/routes/passport/login/login.component.html

@@ -17,9 +17,12 @@
     </nz-form-item>
     <nz-form-item>
       <nz-form-control [nzErrorTip]="'请输入密码' | i18n">
-        <nz-input-group nzSize="large" nzPrefixIcon="lock">
-          <input nz-input type="password" formControlName="password" placeholder="请输入密码" />
+        <nz-input-group nzSize="large" nzPrefixIcon="lock" [nzSuffix]="suffixTemplate">
+          <input nz-input [type]="passwordVisible ? 'text' : 'password'" formControlName="password" placeholder="请输入密码" />
         </nz-input-group>
+        <ng-template #suffixTemplate>
+          <span nz-icon [nzType]="passwordVisible ? 'eye-invisible' : 'eye'" (click)="passwordVisible = !passwordVisible"></span>
+        </ng-template>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>

src/app/routes/passport/login/login.component.ts

@@ -27,6 +27,8 @@ export class UserLoginComponent implements OnDestroy, OnInit {
   tplModalButtonLoading = false;
   isPwVisible = false;
   userId = '';
+  passwordVisible = false;
+
   @ViewChild('baseSf', { static: false }) baseSf!: SFComponent;
   schema: SFSchema = {
     properties: {