AngularJS中的格式化日期无效

问题描述 投票:1回答:2

在我的项目中,数据作为json对象进入前端,如下所示:

{
  id: 1,
  meetingName: "Meeting 1",
  meetingDate: "2018-02-21",
  startTime: "10:00:00"
}

<td>{{meeting.startTime|date:"h:mma"}}</td>

我使用上面的方法将angularjs代码中的日期格式化为10:00 AM。但是开始时间仍然显示为10:00:00。为什么不根据格式格式化日期?

javascript html angularjs
2个回答
2
投票

date过滤器期望日期对象作为输入。但是你传递的是一个字符串。下面是一个示例代码,用于显示预期的日期。

var app = angular.module('myApp', []);
app.controller('datCtrl', function($scope) {
  let info = {
    id: 1,
    meetingName: "Meeting 1",
    meetingDate: "2018-02-21",
    startTime: "10:00:00"
  }
  $scope.meetingDate= new Date(info.meetingDate + " " + info.startTime);
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="datCtrl">

    <p>Meeting Time= {{ meetingDate | date:"h:mma" }}</p>

  </div>

</body>

Date Filter Docs

希望这可以帮助 :)


0
投票

过滤器date需要一个date类型的对象。此自定义过滤器可以帮助您:

View

<div ng-controller="MyCtrl">
  {{data.startTime|timeFilter: data.meetingDate: 'h:mma'}}
  {{data.startTime|timeFilter: data.meetingDate: 'yyyy-MM-dd HH:mm:ss Z'}}
</div>

AngularJS application

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', function($scope) {
  $scope.data = {
    id: 1,
    meetingName: "Meeting 1",
    meetingDate: "2018-02-21",
    startTime: "10:00:00"
  };
});

myApp.filter('timeFilter', function ($filter) {
  return function (data, aDate, dateFilter) {
    return $filter('date')(new Date(aDate + " " + data), dateFilter);
  }
})

> Demo fiddle

© www.soinside.com 2019 - 2024. All rights reserved.