0

使用 Angular Materials 日期选择器。当我从日期选择器中选择一个日期时,该字段显示为红色无效。

这是模板:

<form [formGroup] = "addEvent"  (ngSubmit)="onSubmit()">
   <mat-form-field>
    <input matInput formControlName = "eventDate" [matDatepicker] = "eventDate" placeholder = "Choose a date">
   <mat-datepicker-toggle matSuffix [for] = "eventDate"></mat-datepicker-toggle>
   <mat-datepicker #eventDate></mat-datepicker>
  </mat-form-field>
 </form>

这是响应式表单代码。正则表达式经过测试,可以使用或不使用前导零。

  addEvent = this.formBuilder.group({
    eventDate: ['', Validators.pattern('[0-9]?[0-9]{1}\/[0-9]?[0-9]+\/[0-9]{4}')]
  });
4

1 回答 1

1

只需创建一个ValidatorFn并将其添加到 FormControl 的 Validators 数组中。这是一个简单的演示;

https://stackblitz.com/edit/angular-1egypt

于 2019-06-11T16:08:17.520 回答