Question

每当我更改日期选择器的月份时，我的验证就会开始进行，并且会引发验证错误。但是我只希望在触摸输入字段时显示我的验证错误，并且在更改日期选择器的月份时不填写该字段，因为那时我在该字段中。这是我的代码段

HTML代码

<form action="" method="POST">
    <label>Full Name</label>
    <input name="name" class=signupfields type="text">

    <label>E-mail address</label>
    <input name="email" class=signupfields type="text">

    <label>Enter new password</label>
    <input name="password" class=signupfields type="password">

    <label>Re-enter password</label>
    <input name="repeatpass" class=signupfields type="password">

    <button class="buttons signupbutton">Create account</button>
</form>

ts代码

    <div class="form-group">
                  <label> Start date <span class="mandate">*</span></label>
                  <mat-form-field>
                    <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="startPicker" formControlName="startDate" readonly>
                    <div class="button-container">
                      <button mat-icon-button type="button" aria-haspopup="true" (click)="closePicker(startPicker)" class="picker-button">
                        <svg class="mat-datepicker-toggle-default-icon" viewBox="0 0 24 24" width="24px" height="24px"
                          fill="currentColor" focusable="false">
                          <path d="M0 0h24v24H0z" fill="none" />
                          <path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z" />
                        </svg>
                        &nbsp;
                      </button>
                    </div>

                    <mat-datepicker #startPicker></mat-datepicker>
                  </mat-form-field>
                  <ng-container *ngFor="let err of errMessages.startDate">
                    <mat-error *ngIf="oipChallengeForm.get('startDate').hasError(err.type) && (oipChallengeForm.get('startDate').touched)">
                      {{ err.message }}
                    </mat-error>
                  </ng-container>
                </div>

角材料datepicker验证问题

0 个答案: