Angular Material Datepicker：空日期的自定义字段文本

Question

我正在使用 Angular Material Datepicker。 如果输入的值为空或 null，是否可以在字段中显示自定义文本？ 我没有在 Datepicker API 中找到解决方案。

在我的用例中，用户可以为文章设置可选的发布日期。 如果用户没有设置特定的发布日期（日期为空），我想在输入字段中显示一个文本，如“无发布限制”或“立即发布”或类似的内容。

谢谢你的帮助。

Answer 1

假设您也使用 Material Inputs，您可以非常轻松地管理日期输入的标签。

<mat-form-field appearance="fill">
  <mat-label>YOUR LABEL or {{yourLabel}}</mat-label>
  <input matInput [matDatepicker]="picker">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

即使没有材料输入，您也可以管理输入的占位符以在输入为空时显示文本。

如果您需要的不仅仅是一个文本字段，那么更进一步的将是监听日期选择器的角度变化并动态添加/附加其他数据