AngularJS:orderBy过滤器以反转表行的顺序不起作用

时间:2015-07-11 20:21:23

标签: angularjs datatable angularjs-ng-repeat html-table angularjs-orderby

我正在编写一个Web应用程序,允许用户发布到服务器,前端显示所有帖子。但是,当用户添加帖子时,它会首先到达所有帖子的底部。我希望最新的帖子转到所有帖子的顶部。

我尝试使用:

ng-repeat="post in posts | orderBy:'-'"

ng-repeat="post in posts | orderBy:'-index'"

这是我的表格代码:

         <div ng-repeat="post in posts | orderBy:'-'">
              <table>
                <tr>
                  <td>{{$index}}</td>

                  <td>{{post.username}}</td>

                  <td>{{post.title}}</td>

                  <td>{{post.content}}</td>

                  <td>{{post.comment}}</td>
                </tr>
              </table>
          </div>

然而,这两种方法都不起作用。还有另一种方式吗?

1 个答案:

答案 0 :(得分:0)

您可以根据它们在未排序的posts数组中的位置进行排序。您可以使用如下函数执行此操作:

$scope.newestFirst = function(post) {
    return -$scope.posts.indexOf(post);
}

然后在HTML中:<div ng-repeat="post in posts | orderBy:newestFirst">

这里是fiddle。使用newestFirst排序,新帖子会添加到列表顶部。

您会注意到,即使您更改帖子的顺序,索引列也保持不变。似乎$index给出了当前排序中每个帖子的索引。按$index排序仍然会按照源数组中的索引对帖子进行排序,但是通过一串乱码来排序产生相同的结果,所以我认为这是巧合。