角度材料日期选取器:检查非必填日期字段的无效日期

Question

角度材料日期选择器返回时刻对象，它为无效日期格式以及空/空日期字段返回 null。

有没有办法区分无效日期格式和空日期。

Answer 1

如果您使用的是 Angular 的反应式表单，则可以在表单控件中包含验证器方法，以便它们将被标记相应的错误。

yourForm = this.formBuilder.group({
  date: [null, Validators.required]
});

您可以通过调用 errors 属性来访问上述抽象控件上的错误，如文档中指定的那样。

this.yourForm.controls.date.valid;
// returns true or false

如果要检查特定错误，例如required，则可以使用hasError()方法

this.yourForm.controls.date.hasError('required');

Answer 2

在 Angular Material 8 中，存在与所需错误不同的格式错误，该错误仅在您拥有 Validators.required 验证器时才会出现。

使用错误的日期格式，您会收到以下错误：

birthdate.errors = {
  "required": true,
  "matDatepickerParse": {
    "text": "44/3/2020"
  }
}

因此，为了区分，请查看"matDatepickerParse"键下的错误。

使用空输入，您可以得到：

birthdate.errors = {
  "required": true
}