Angular matDatepicker 禁用日期转换

Question

我想为 MatDatepicker 创建一个 simpleDateFormatterDirective 等： 当我将简单的 4 或 6 个数字写入日历时，指令将其替换为真实日期

0123 -> 2021-01-23 200415 -> 2020-04-15

但是当我尝试用模糊捕捉它时，matDatePicker 尝试将它转换为新的 Date(inputvalue) 所以我抓住了 0123 - (123-01-01) 那么我可以禁用 datepicker 的这个功能还是有其他想法来实现这个功能？

<mat-form-field appearance="fill" class="example-form-field">
  <mat-label>Choose a date</mat-label>
  <input simpleDateFormatterDirective matInput [matDatepicker]="datepicker">
  <mat-datepicker-toggle matSuffix [for]="datepicker"></mat-datepicker-toggle>
  <mat-datepicker #datepicker>
    <mat-datepicker-actions>
      <button mat-button matDatepickerCancel>Cancel</button>
      <button mat-raised-button color="primary" matDatepickerApply>Apply</button>
    </mat-datepicker-actions>
  </mat-datepicker>
</mat-form-field>

Answer 1

您可能需要创建一个自定义的DateAdapter，它负责解析和格式化材料组件中的日期。

然后您需要在应用程序的某个级别提供该适配器 - 无论是根目录还是组件内部。

您可以扩展标准 NatvieDateAdapter 并使用自定义逻辑覆盖您需要的方法。

您可能还必须为您的用例提供MAT_DATE_FORMATS - 除非您在适配器中对其进行硬编码。