以编程方式将 Angular DateTime 管道用于 hh:mm:ss 格式答案

【问题标题】：Using Angular DateTime pipe programmatically for hh:mm:ss formats以编程方式将 Angular DateTime 管道用于 hh:mm:ss 格式
【发布时间】：2020-07-23 16:10:25
【问题描述】：

我正在尝试将 DatePipe 用于 HH:MM:SS（或任何其他记录格式），就像我将 DecimalPipe 用于货币价值一样。

但是，将我的逻辑传递给hh:mm:ss 等格式后，我的值会立即变为07:00:00。

time = 'hh:mm:ss';
val = '1:02'; // user entered value
invalids = new RegExp('[^0-9:]{0,6}', 'g'); // time chars only
replaced = String(val).replace(invalids, ''); // remove non-hhmmss characters
let value = this.datePipe.transform(replaced, time); // format the value
console.log(value); // '07:00:00' why!?

这是StackBlitz:67 中的重现

如何让组件接受那些预定义的格式来强制输入值？

【问题讨论】：

.transform 的 first 参数不应该是时间吗？请给一个正确的minimal reproducible example。
嘿@jonrsharpe 感谢您的反馈，但是在我的用例中，用户输入了一个值（请参阅正则表达式强制基于时间的字符）然后我希望使用datePipe 将其格式化为任何格式，@在这种情况下为 987654331@。
哦，replaced 是时间，this.time 是格式？再次，minimal reproducible example。
我在 SB 上大放异彩，但也根据您的指示在此处重写了代码。感谢您的友好解释。

标签： javascript angular datetime pipe

【解决方案1】：

Angular DatePipe 的输入类型为 any，但实际上需要一个日期、毫秒或 ISO 格式的字符串，而您没有提供它。

https://angular.io/api/common/DatePipe#input-value

value any 日期表达式：一个 Date 对象，一个数字（毫秒自 UTC 纪元以来），或 ISO 字符串 (https://www.w3.org/TR/NOTE-datetime)。

您传入的数据不符合该标准，因此它可能不适用于您的用例，除非您可以在发送到 datePipe 之前对其进行修改。

【讨论】：