Menu
I'm using the date filter to render a unix timestamp in a certain format. I've noticed the filter adds the local timezone to the output.
Is there any way to simply output the exact timestamp, without adding any timezone information?
Input:
talk.content.date_and_time = 1400167800 (is 05 / 15 / 14 @ 3:30:00pm UTC)
Code:
{{talk.content.date_and_time*1000 | date:'dd-M-yyyy H:mm Z'}} Output:
15-5-2014 17:30 +0200 How can I make the output 15:30 instead of 17:30?
702
Knowing just the offset from UTC, you can't tell what timezone you are in, because of DST. You could consider looking at the time part of the time to try to guess whether DST was in effect then or not, but political considerations make that nearly impossible, as different jurisdictions change the definition of DST.
DateTime itself contains no real timezone information. It may know if it's UTC or local, but not what local really means. DateTimeOffset is somewhat better - that's basically a UTC time and an offset.
Date to format either as Date object, milliseconds (string or number) or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss. sssZ and its shorter versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd or yyyyMMddTHHmmssZ).
How to display UTC date time in angular using date pipe. To display UTC date and time in Angular we have to pass timezone parameters as ‘UTC’ or timezone offset as ‘+0000’ as shown below. Today is { {todayDate | date:'short':'UTC'}} Today is { {todayDate | date:'short':'+0000'}} Result: Today is 6/19/19, 11:11 AM.
All types of datetime values displays the date in ‘MMM d, y’ format which is default Angular date format ‘mediumDate’. To change the datetime format in angular we have to pass date time format parameter to the angular pipe as shown below. { { date_value | date :'short'}} // 6/15/19, 5:24 PM.
Since version 1.3.0 AngularJS introduced extra filter parameter timezone, like following: But in versions 1.3.x only supported timezone is UTC, which can be used as following:
Both the predefined date formats and customized date formats can be passed in Angular. The default value for formatting the date is mediumDate. The user’s local system timezone is the default value. The timezone offset or standard GMT/UTC or continental US timezone abbreviation can also be passed.
Since version 1.3.0 AngularJS introduced extra filter parameter timezone, like following:
{{ date_expression | date : format : timezone}} But in versions 1.3.x only supported timezone is UTC, which can be used as following:
{{ someDate | date: 'MMM d, y H:mm:ss' : 'UTC' }} Since version 1.4.0-rc.0 AngularJS supports other timezones too. I was not testing all possible timezones, but here's for example how you can get date in Japan Standard Time (JSP, GMT +9):
{{ clock | date: 'MMM d, y H:mm:ss' : '+0900' }} Here you can find documentation of AngularJS date filters.
NOTE: this is working only with Angular 1.x
Here's working example
56
The 'Z' is what adds the timezone info. As for output UTC, that seems to be the subject of some confusion -- people seem to gravitate toward moment.js.
Borrowing from this answer, you could do something like this without moment.js:
controller
var app1 = angular.module('app1',[]); app1.controller('ctrl',['$scope',function($scope){ var toUTCDate = function(date){ var _utc = new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds()); return _utc; }; var millisToUTCDate = function(millis){ return toUTCDate(new Date(millis)); }; $scope.toUTCDate = toUTCDate; $scope.millisToUTCDate = millisToUTCDate; }]); template
<html ng-app="app1"> <head> <script data-require="angular.js@*" data-semver="1.2.12" src="http://code.angularjs.org/1.2.12/angular.js"></script> <link rel="stylesheet" href="style.css" /> <script src="script.js"></script> </head> <body> <div ng-controller="ctrl"> <div> utc {{millisToUTCDate(1400167800) | date:'dd-M-yyyy H:mm'}} </div> <div> local {{1400167800 | date:'dd-M-yyyy H:mm'}} </div> </div> </body> </html> here's plunker to play with it
See also this and this.
Also note that with this method, if you use the 'Z' from Angular's date filter, it seems it will still print your local timezone offset.
41
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
