Сообщения о проверке даты и времени для угловых материалов - PullRequest
Новая
       17

Сообщения о проверке даты и времени для угловых материалов

0 голосов
/ 22 февраля 2019

Как показать сообщения проверки для ошибок проверки минимальной и максимальной дат в Угловой подборщик материалов 

<input [min]="minDate" [max]="maxDate" matInput [matDatepicker]="picker" [formControlName]="date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>

<mat-error class="error-message" *ngIf="formgroup.get('date').hasError('required') && (formgroup.get('date').dirty || formgroup.get('date').touched)">Date is Required</mat-error>

Здесь Требуется Проверка установлена.

Как и я, я хочу показать Дата должна быть больше, чем 01/01/2019 сообщение, если пользователь набрал дату, которая меньше minDate.

Я знал, что все предыдущиедаты будут отключены, если мы установим minDate.Но в этом приложении мы также разрешаем пользователю вводить дату!Поэтому, когда пользователь вводит дату, которая предшествует определенному minDate , я хочу показать сообщение об ошибке!

Любой способ добиться этого?

1 Ответ

0 голосов
/ 22 февраля 2019

Вы можете использовать ссылку на ngModel, чтобы узнать, не ошиблась ли дата.

В этот стекаблиц , я сделал так, чтобы вы могли видеть ошибки, примененные к входу (чтобы вы могли знать ошибку), а также отображатьошибка, когда ввод ошибочен.

<mat-form-field class="example-full-width">
  <input matInput #input="ngModel" [(ngModel)]="date" [min]="minDate" [max]="maxDate" [matDatepicker]="picker" placeholder="Choose a date">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker></mat-datepicker>

  <mat-error *ngIf="input.hasError('matDatepickerMax')">Date should be inferior</mat-error>

</mat-form-field>

<br><br><br>
{{ input.errors | json }}
...