Angular自定义日期格式：如何保留固定字符H而非解析为24小时制？

你遇到的这个问题其实是Angular DatePipe的一个常见用法细节——当你需要在格式字符串中保留字面量字符（比如这里的"H"）时，必须把它用单引号包裹起来，否则管道会把它当成日期格式占位符来解析。

最优解决方案 #

直接修改你的格式字符串，把"H"用单引号括起来即可，这样它就会被当作普通文本输出：

{{myDate | date: 'MM.dd.yy hh\'H\'mm'}}

如果你的模板中使用双引号来包裹格式字符串，单引号不需要转义，写法更简洁：

{{myDate | date: "MM.dd.yy hh'H'mm"}}

这样就能直接输出你想要的格式：11.09.19 05H30。

原理说明 #

Angular的DatePipe遵循Unicode CLDR（Common Locale Data Repository）的日期格式规则，其中未被单引号包裹的字母会被识别为格式占位符（比如h代表12小时制小时，H代表24小时制小时）。通过将需要保留的字符用单引号包裹，管道就会跳过对它的解析，直接输出原字符。

相比你之前拆分日期的写法，这个方案只需要调用一次DatePipe，代码更简洁优雅，也更符合Angular管道的设计意图。

如果是在组件类中通过DatePipe服务来转换日期，写法也是类似的：

import { DatePipe } from '@angular/common';

// 注入DatePipe后使用
formattedDate = this.datePipe.transform(myDate, "MM.dd.yy hh'H'mm");

内容的提问来源于stack exchange，提问作者sgaleta