Question

我有一个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>

我在MySQL数据库表中created_at为timestamp。我正在使用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 = [];
});

Answer 1

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

您是否检查过值blog.created_at显示为没有过滤器的内容？

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

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

您可以按如下方式编写自己的过滤器：

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>

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

Answer 2

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

这可以使用此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 = [];
});

Answer 3

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

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>

Answer 4

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

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

无论如何，您可以在 Plunker 中看到此演示。

希望它能帮到你

Answer 5

记录日期变量时请记得使用＆＃39; new＆＃39;关键字如下：

var time = new Date();

否则，如果你这样写：

var time = Date();

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

Angularjs日期过滤器不起作用

5 个答案: