将日期和时间转换为单一格式字符串的角度过滤器

angular filter which convert date and time to single formatted string

本文关键字：字符串 过滤器 格式 单一 日期 时间 转换      更新时间：2023-09-26

我使用的是来自API的数据，它返回两个不同键/值对（日期和时间）中的日期和时间。

<!DOCTYPE html>
<html ng-app="app">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body ng-controller="ctrl">
  Date {{date}} - Time {{time}}
  <br/>
  {{date  | dateformatter}}
</body>
</html>

angular.module("app",[]).controller("ctrl", function($scope) {
  $scope.date = "03/13/2014";
  $scope.time = "8:10:56";
}).filter("dateformatter", function($filter){
  // this should return 'yyyy-MM-dd h:mm:ss'
  return function(dt) {
    return "2014 03 13 8:10:56";
  }
})

我可以使用过滤器将其转换为单一格式的字符串吗？

这是jsBin中的一个例子

我会将Date和Time转换为Date对象，并使用日期过滤器

所以控制器看起来像：

app.controller("ctrl", function($scope) {
  $scope.date = "03/13/2014";
  $scope.time = "8:10:56";
  $scope.newDate = new Date( $scope.date + ' ,' + $scope.time).getTime();     
});

和HTML:

{{newDate  | date: 'yyyy-MM-dd h:mm:ss'}}

演示Fiddle

另一种快速方法：

angular
.module('PrivateModule')
.controller('MyController', ['$scope', function ($scope) {
    $scope.Date = function(date) {
        return new Date(date);
    }
}

那么在你看来：

<span>{{Date(obj.start) | date : 'dd/MM/yyyy'}}</span>

下面是一个尝试：

+(function(angular, undefined) {
  angular
    .module('app')
    .filter('timestamp', filter);
  function filter() {
    return function filterFn(input) {
      return ( Date.parse(input) );
    }
  }
})(angular);

用法：{{ date | timestamp | date: 'MMM d, yyyy' }}。在您的情况下，{{ date + ' ,' + time | timestamp | date: 'MMM d, yyyy' }}。

这是一个更好的解决方案，消除了不属于控制器的问题。

将很快向bower提供此功能，请检查my存储库，如果有的话，这比粘贴要点/片段的副本要好（适合开发人员的）。

相关文章：