Question

我希望将时间显示为AM和PM，是否可以使用角度日期过滤器。我尝试过以下代码，但对我不起作用。

<div>{{ '12:31:07' | date:'HH:mm' }}</div>

Answer 1

尝试自定义过滤器：

<强> HTML ：

<div ng-app>
  <div ng-controller="TodoCtrl">
    <div>{{ '12:31:07' | time }}</div>
  </div>
</div>

<强> JS：

angular.module('myApp').filter('time', ['$filter', function ($filter) {
    return function (input, arg) {
        var parts = input.split(':');
        var date = new Date(0, 0, 0, parts[0], parts[1], parts[2]);
        return $filter('date')(date, arg || 'mediumTime');
    };
}]);

演示：http://jsfiddle.net/U3pVM/33868/

或使用默认过滤器：

尝试：

<div>{{ '12:31:07' | date:'mediumTime' }}</div>

或

<div>{{ '12:31:07' | date:'shortTime' }}</div>

您还可以尝试使用'medium'或'short'进行日期过滤

参考：https://docs.angularjs.org/api/ng/filter/date

Answer 2

根据日期过滤器的Angular文档，date参数应采用有效格式。

格式化为Date对象，毫秒（字符串或数字）或各种ISO 8601日期时间字符串格式的日期（例如yyyy-MM-ddTHH：mm：ss.sssZ及其较短版本，如yyyy-MM-ddTHH：mmZ， yyyy-MM-dd或yyyyMMddTHHmmssZ）。如果字符串输入中未指定时区，则认为时间在本地时区。

因此，您需要事先格式化时间字符串。例如;

<div>{{ '2017-09-04T12:31:07' | date:'h:mma' }}</div>

将为您提供所需的结果。

如何使用AngularJS日期过滤器显示时间

2 个答案: