Question

我对测试Todo应用程序有一个json响应，所以我可以在这里学习AngularJS是Json响应：

{"id":"1","text":"Et aut optio et enim necessitatibus magni voluptatem.","due_date":"1970-08-04 00:00:00","priority":"2","created_at":"2014-09-15 01:26:52","updated_at":"2014-09-15 01:26:52"}

然后我通过所有响应进行角度循环并创建待办事项表：

<table class="table table-striped table-condensed table-hover">
    <thead>
        <th>Todo</th>
        <th>Priority</th>
        <th>Due Date</th>
    </thead>
    <tbody>
        <tr ng-repeat="todo in todos">
            <td>{{ todo.text }}</td>
            <td>{{ todo.priority }}</td>
            <td>{{todo.due_date | date:mediumDate}}</td>
        </tr>
    </tbody>
</table>

除了日期之外，一切正常：mediumDate过滤器表中的日期仍然显示时间戳样式而不是过滤后的格式。什么可能导致它失败？

Answer 1

您需要将mediumDate指定为字符串，以便date:'mediumDate'

如后所述，您使用的日期字符串不是AngularJs认可的ISO 8601日期格式，因此要使其使用相同的数据，您需要使用标准日期格式发送json或自行解析。如果要解析上面的日期字符串，可以使用以下代码：

  $scope.parseTheDate = function(dateString) {
    if (dateString) {
      var properlyFormattedDate = dateString.split(" ").join("T");
      return new Date(properlyFormattedDate);
    } else {
      return null;
    }
  };

并将其与html：

结合使用

    <tr ng-repeat="todo in todos">
        <td>{{ todo.text }}</td>
        <td>{{ todo.priority }}</td>
        <td>{{ parseTheDate(todo.due_date) | date:'mediumDate'}}</td>
    </tr>

work plunker：http://plnkr.co/edit/xDhCzpYEQOoflKLs3pSq?p=preview

angularJS过滤器不过滤数据

1 个答案: