HTML时间的时间格式所有浏览器都支持输入类型答案

【问题标题】：Time format of HTML time Input type support by all browsersHTML时间的时间格式所有浏览器都支持输入类型
【发布时间】：2019-12-19 22:08:30
【问题描述】：

嗨，

我正在使用 Angular /Jhipster 开展一个项目。我目前的输入表单有问题，事实上，我创建了一个 Type="TIME" 的输入表单。它可以在我的浏览器上完美运行，例如 (12:24)，但在其他浏览器中，它以另一种形式显示，例如 (12:24 AM)，或者在其他一些浏览器中显示为普通字符串而不是时间。我该如何解决它，我希望它显示在像我这样的所有其他浏览器中。

<input id="timeVar" type="time" name="usr_time" value="09:36"
(change)="setDefValue($event,'usr_time')" required pattern="[0-9]{2}:[0-9]{2}">

谢谢！

【问题讨论】：

在此处查看支持的浏览器版本 - developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time
有没有办法让它被所有浏览器支持？需要在所有浏览器中平等显示！
您需要创建自己的自定义时间输入或使用任何现有的库，例如ng-bootstrap.github.io/#/components/timepicker/examples。

标签： html angular forms time browser

【解决方案1】：

我不确定是否有任何解决方案。我明白了，您也尝试过使用模式。如果您愿意尝试其他选择，请在线搜索时间选择器。也许这应该有所帮助，我认为它将在所有浏览器中标准化时间模式。

【讨论】：

【解决方案2】：

如果您使用的是 Angular 项目，则可以使用 Angular DatePipe。这是最简单的方法，无需创建自己的解决方案。

例如：{{valueDate | date: 'dd/MM/yyyy'}} 或 {{ dateObj | date }}。

您可以选择输出。查看文档中的文档 => 示例。

{{ dateObj | date:'medium' }}      // output is 'Jun 15, 2015, 9:43:11 PM'
{{ dateObj | date:'shortTime' }}   // output is '9:43 PM'
{{ dateObj | date:'mm:ss' }}       // output is '43:11'`

Angular doc to DatePipe

【讨论】：