24

我有一个ng-repeat将遍历$http.get()结果的元素。

<tr ng-repeat="blog in posts">
     <td style="text-align:center">{{ $index+1 }}</td>
     <td>{{ blog.title }}</td>
     <td>
         {{ blog.author.name }}
     </td>
     <td>
         {{ blog.created_at | date:'MMM-dd-yyyy' }}
     </td>
</tr>

我有created_at在timestampMySQL 数据库表中。我正在使用angular.js v1.0.7.

我从 db 表中得到相同的输出，并且日期过滤器不起作用。我该如何解决这个问题？

我的ajax调用，

$http({method: 'GET', url: 'http://localhost/app/blogs'}).
success(function(data, status, headers, config) {
    $scope.posts = data.posts;
}).
error(function(data, status, headers, config) {
    $scope.posts = [];
});
4

5 回答 5

42

传递给过滤器的日期必须是 javascript Date 类型。

您是否检查了blog.created_at没有过滤器时显示的值？

您说您的支持服务正在返回一个表示日期的字符串。您可以通过两种方式解决此问题：

  1. 让您的服务器端代码返回一个 json 日期对象
    • 检查服务器端代码如何序列化它返回的 json
  2. 编写您自己的过滤器，它接受字符串日期并以所需格式返回日期
    • 注意：您可以在自己的过滤器中调用角度过滤器

您可以编写自己的过滤器，如下所示：

app.filter('myDateFormat', function myDateFormat($filter){
  return function(text){
    var  tempdate= new Date(text.replace(/-/g,"/"));
    return $filter('date')(tempdate, "MMM-dd-yyyy");
  }
});

并在您的模板中像这样使用它：

<td>
  {{ blog.created_at | myDateFormat }}
</td>

而不是遍历返回的数组然后应用过滤器

于 2013-10-29T09:02:05.367 回答
15

从服务器端，它created_at从 laravel eloquent 返回 as 字符串。

这可以使用这个javascript来解决，

new Date("date string here".replace(/-/g,"/"));

所以代码，

$http({method: 'GET', url: 'http://localhost/app/blogs'}).
success(function(data, status, headers, config) {
   angular.forEach(data.posts, function(value, key){
     data.posts[key].created_at = new Date(data.posts[key].created_at.replace(/-/g,"/"));
   }
   $scope.posts = data.posts;
}).
error(function(data, status, headers, config) {
    $scope.posts = [];
});
于 2013-10-29T10:25:31.213 回答
9

您可以添加一个自定义过滤器，将字符串转换为日期，如下代码：

app.filter('stringToDate',function ($filter){
    return function (ele,dateFormat){
        return $filter('date')(new Date(ele),dateFormat);
    }
})

然后在任何模板中使用此过滤器作为以下代码：

<div ng-repeat = "a in data">{{a.created_at |stringToDate:"medium"}}</div>
于 2017-01-07T10:40:17.523 回答
6

您可以new Date(/*...*/)根据从中获取的数据进行创建$http.get，例如：

$scope.date = new Date('2013', '10', '28'); // for example

无论如何，您可以在Plunker.

希望对你有帮助

于 2013-10-29T09:33:45.883 回答
2

记录日期变量时，请记住使用“新”关键字，如下所示：

var time = new Date();

否则，如果你这样写：

var time = Date();

日期作为函数调用，将返回一个日期时间字符串，该字符串不能用作过滤器的输入。

于 2015-02-02T06:00:14.617 回答