使用带 UTC 日期的 AngularJS 日期过滤器

小开

最佳答案

类似问题给你

我会重新发布我的回应，提议合并:

输出 UTC 似乎是一些混乱的主题-人们似乎倾向于等一下 JS。

借用这个回答，您可以在不使用 Moment.js 的情况下执行类似的操作(例如，使用用 UTC 构造函数创建日期的转换函数) :

控制器

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;


}]);

模板

<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>

这是混蛋

参见这个和这个。

还要注意的是，使用这种方法，如果你使用“ Z”从角度的日期过滤器，它似乎仍然会打印您的本地时区偏移。

小开

在 angular.js 的回购文件中有一个错误 Https://github.com/angular/angular.js/issues/6546#issuecomment-36721868

小开

如果您确实使用 moment. js，那么应该使用 moment ()。函数将矩对象转换为 UTC。通过使用 moment () ，您还可以在控制器内部而不是在视图内部处理好的格式。Format ()函数。例如:

moment(myDate).utc().format('MM/DD/YYYY')

小开

看起来 AngularJS 的人正在1.3.0版本中开发它。您所需要做的就是在格式化字符串后面添加 : 'UTC'，比如:

\{\{someDate | date:'d MMMM yyyy' : 'UTC'}}

正如你在医生中看到的，你也可以在这里玩: 笨蛋的例子

顺便说一句，我认为 Z 参数有一个 bug，因为即使使用“ UTC”，它仍然显示本地时区。

小开

下面是一个过滤器，它接受一个日期字符串或 javascript Date ()对象。它使用等一下，并且可以应用任何等一下转换函数，比如流行的‘ from Now’

angular.module('myModule').filter('moment', function () {
return function (input, momentFn /*, param1, param2, ...param n */) {
var args = Array.prototype.slice.call(arguments, 2),
momentObj = moment(input);
return momentObj[momentFn].apply(momentObj, args);
};
});

那么..。

\{\{ anyDateObjectOrString | moment: 'format': 'MMM DD, YYYY' }}

会显示 Nov 11,20142014年11月11日

\{\{ anyDateObjectOrString | moment: 'fromNow' }}

会显示 10分钟前

如果你需要调用多个矩函数，你可以链接它们。

\{\{ someDate | moment: 'utc' | moment: 'format': 'MMM DD, YYYY' }}

小开

Osek解决方案的进化版本

自定义筛选器更合适，那么您可以在项目的任何地方使用它

Js file

var myApp = angular.module('myApp',[]); myApp.filter('utcdate', ['$filter','$locale', function($filter, $locale){ return function (input, format) { if (!angular.isDefined(format)) { format = $locale['DATETIME_FORMATS']['medium']; } var date = new Date(input); var d = new Date() var _utc = new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds()); return $filter('date')(_utc, format) }; }]);

在模板

<p>This will convert UTC time to local time<p> <span>\{\{dateTimeInUTC | utcdate :'MMM d, y h:mm:ss a'}}</span>

小开

它可以通过以下方式声明过滤器吗？

app.filter('dateUTC', function ($filter) { return function (input, format) { if (!angular.isDefined(format)) { format = 'dd/MM/yyyy'; } var date = new Date(input); return $filter('date')(date.toISOString().slice(0, 23), format); }; });

小开

您还可以为日期编写一个自定义过滤器，以 UTC 格式显示日期。注意，我使用了 toUTCString()。

var app = angular.module('myApp', []); app.controller('dateCtrl', function($scope) { $scope.today = new Date(); }); app.filter('utcDate', function() { return function(input) { return input.toUTCString(); }; });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <div ng-app="myApp" ng-controller="dateCtrl"> Today is \{\{today | utcDate}} </div>

小开

经过一些研究，我能够找到一个很好的解决方案，转换 UTC 到本地时间，看看小提琴。希望能有帮助

Https://jsfiddle.net/way2ajay19/2kramzng/20/

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app ng-controller="MyCtrl"> \{\{date | date:'yyyy-mm-dd hh:mm:ss' }} </div> <script> function MyCtrl($scope) { $scope.d = "2017-07-21 19:47:00"; $scope.d = $scope.d.replace(" ", 'T') + 'Z'; $scope.date = new Date($scope.d); } </script>

小开

如果您在.Net 中工作，那么在 web.config 中添加以下内容

<system.web>

会解决你的问题:

<globalization culture="auto:en-US" uiCulture="auto:en-US" />