如何隐藏 Angular DatePicker 日期格式提示？答案

【问题标题】：How to hide Angular DatePicker date format prompt?如何隐藏 Angular DatePicker 日期格式提示？
【发布时间】：2017-10-31 12:15:19
【问题描述】：

例如，通常的日期选择器代码如下：

<kendo-datepicker [value]="value"></kendo-datepicker>

当“value”为空或为空时，它会向您显示提示：

month/day/year

如何隐藏该提示？

编辑：此功能正在开发中。它应该很快就会发布。

【问题讨论】：

【解决方案1】：

随着 DateInput 的最新变化（从 v1.4.0-dev 开始），添加了两个附加属性：

有了这些，我们可以轻松隐藏或修改显示的格式描述：

<kendo-datepicker [placeholder]="Enter date..." [formatPlaceholder]="short" />

这是一个演示这些新属性的 plunker 演示：

请注意，所描述的功能仅在 @dev 频道中可用。 不过应该很快就会发布。

编辑：@progress/kendo-angular-dateinputs@1.4.0 正式发布。只需使用 1.4.0 或更高版本即可使用上述部分选项。

【讨论】：

我已经在 chrome 上运行了你的 plunker 并且在预览中没有显示任何内容:(
这很奇怪。它似乎对我有用 - screencast.com/t/244mTlyVr 。另一种选择是使用 @progress/kendo-angular-dateinputs@dev 包构建一个简单的 Angular 应用程序。
我发现了问题 - plunker 使用了 Intranet 链接。演示已更新，应该可以按预期工作。 – George K 4 小时前
谢谢。现在它起作用了。 placeholder=" " 几乎是我需要的。

【解决方案2】：

问题在于 kendo datepicker 占位符属性。

DateInput 和 DatePicker 组件不正确地公开占位符属性。默认情况下，日期格式字符串，例如显示月/日/年。

您可以通过#519获取更多详细信息。

【讨论】：

【解决方案3】：

我认为没有办法以编程方式执行此操作，但是我知道如何执行此操作，并在 Chrome 开发工具中对其进行了简要测试。

在你的日期选择器组件上添加一些类

<kendo-datepicker [ngClass]={'empty': !date }>

然后添加样式

.k-datepicker.empty input {
    text-indent: -9999px;
}

这应该可以解决问题。

【讨论】：