How to get amCalendar filter in 24hours format (Angular-Moment.js)

Question

I am using angular-moment, and the moment add function: moment().add(7, 'h'); .

In order to display when an approval will be done.

I have a table showing estimation for approval for various products. I am using amCalender filter. The results may for example show today at 10pm etc. I want the time to be in 24 hours format instead (today at 22:00).

Answer 1

As the docs says, amCalendar :

Format dates using moment.js calendar() method.

You can customize moment calendar output using moment.updateLocale . By default moment use '[Today at] LT' , '[Tomorrow at] LT' etc, while in your case you need '[Today at] HH:mm' etc.

Here a live working example:

 angular.module('MyApp',['angularMoment']) .run(function(){ moment.updateLocale('en', { calendar : { lastDay : '[Yesterday at] HH:mm', sameDay : '[Today at] HH:mm', nextDay : '[Tomorrow at] HH:mm', lastWeek : '[last] dddd [at] HH:mm', nextWeek : 'dddd [at] HH:mm', sameElse : 'L' } }); }) .controller('AppCtrl', function($scope) { $scope.message = {}; $scope.message.time = moment().add(7, 'h'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.1/angular-moment.min.js"></script> <div ng-app="MyApp" ng-controller="AppCtrl"> <span>{{message.time | amCalendar}}</span> </div> 

Answer 2

尝试这个。

moment().add(7, 'h').format('H:mm');