Question

一旦我开始从用户名输入中键入任何内容，如下图所示。它显示confirm password field无效。我想要实现的是，仅当我从password字段或confirm password字段开始键入内容时，我才想看到它，而不是从第一个输入框开始键入时显示由{ {1}}。

A descriptive picture

表格

dirty form

TS文件

<mat-form-field>
    <mat-label>New Password</mat-label>
    <input matInput type="password" placeholder="New Password"  formControlName="password" autocomplete="off" />
    <mat-error *ngIf="isControlHasError('password','required')">
        <strong>{{ 'AUTH.VALIDATION.REQUIRED_FIELD' | translate }}</strong>
    </mat-error>
    <mat-error *ngIf="isControlHasError('password','minlength')">
        <strong>{{ 'AUTH.VALIDATION.MIN_LENGTH_FIELD' | translate }} 4</strong>
    </mat-error>
    <mat-error *ngIf="isControlHasError('password','maxlength')">
        <strong>{{ 'AUTH.VALIDATION.MAX_LENGTH_FIELD' | translate }} 20</strong>
    </mat-error>
</mat-form-field>
<mat-form-field>
    <mat-label>Confirm New Password</mat-label>
    <input matInput type="password" placeholder="Confirm New Password"  [errorStateMatcher]="matcher" formControlName="confirmPassword" autocomplete="off" />
    <mat-error *ngIf="isControlHasError('confirmPassword','required')">
        <strong>{{ 'AUTH.VALIDATION.REQUIRED_FIELD' | translate }}</strong>
    </mat-error>
    <mat-error *ngIf="isControlHasError('confirmPassword','minlength')">
        <strong>{{ 'AUTH.VALIDATION.MIN_LENGTH_FIELD' | translate }} 4</strong>
    </mat-error>
    <mat-error *ngIf="isControlHasError('confirmPassword','maxlength')">
        <strong>{{ 'AUTH.VALIDATION.MAX_LENGTH_FIELD' | translate }} 20</strong>
    </mat-error>
    <mat-error *ngIf="forgotPasswordForm.hasError('notSame')    ">
        <strong>Password do not match</strong>
    </mat-error>
</mat-form-field>

仅原始密码不正确时如何显示确认密码

0 个答案: