1

ng-repeat 中显示的数据是从 firebase db 获取的，因此是异步加载的

这是 HTML：

<tr ng-animate="{enter: 'animate-enter', leave: 'animate-leave'}" ng-repeat="player in players|orderBy:'-Level'" class="neutral">
    <td>{{$index+1}}</td>
    <td>{{player.PlayerName}}</td>
    <td>{{player.Wins}}</td>
    <td>{{player.Losses}}</td>
    <td>{{player.Level}}</td>
  </tr>

这是我的控制器：

app.controller 'RankController', ($scope, angularFire) ->

  $scope.players;
  ref = new Firebase("https://steamduck.firebaseio.com/players")
  angularFire(ref, $scope, 'players')

在此处输入图像描述

我究竟做错了什么？为什么列表没有按级别排序？

编辑：如果我使用lukpaw制作的模型，这会非常有效。因此，问题必须出在我收到的数据中，如下所示：

在此处输入图像描述

4

4 回答 4

1

我认为你的排序是好的。我做了简单的例子，它以你的方式工作。也许您的代码中没有放置的东西是错误的（首先检查 JavaScript 控制台）。

HTML：

<!doctype html>
<html ng-app="App">
<head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
  <script type="text/javascript" src="script.js"></script>
</head>
<body>

  <div ng-controller="Ctrl">
    <table border="1">
      <tr ng-animate="{enter: 'animate-enter', leave: 'animate-leave'}" ng-repeat="player in players | orderBy:'-Level'">
        <td>{{$index+1}}</td>
        <td>{{player.PlayerName}}</td>
        <td>{{player.Wins}}</td>
        <td>{{player.Losses}}</td>
        <td>{{player.Level}}</td>
      </tr>
    </table>
  </div>

</body>
</html>

JavaScript：

angular.module('App', []);

function Ctrl($scope) {
  $scope.players =
      [{PlayerName:'John', Wins: 12, Losses:10, Level: 2},
       {PlayerName:'Mary', Wins:7, Losses:19, Level: 1},
       {PlayerName:'Mike', Wins:5, Losses:21, Level: 1},
       {PlayerName:'Adam', Wins:9, Losses:35, Level: 3},
       {PlayerName:'Julie', Wins:10, Losses:29, Level: 2}]
}

Plunker 示例

于 2013-11-11T08:35:58.350 回答
1

看起来 orderBy 过滤器只知道如何对数组进行排序。因此，这永远不会与用作模型的 JSON 对象一起使用。

我最终实现了自己的过滤器：

app.filter "orderObjectBy", ->
  (input, attribute) ->
    return input  unless angular.isObject(input)
    array = []
    for key of input
      array.push input[key ]
    array.sort (a, b) ->
      a = parseInt(a[attribute])
      b = parseInt(b[attribute])
      b - a

ng-repeat="玩家中的玩家 | orderObjectBy:'Level'"

于 2013-11-11T22:07:38.303 回答
0

受@RonnieTroj 回答的启发，这个过滤器重用了内置的 orderBy 过滤器，并且可以处理任何可比较类型的数组和对象，而不仅仅是整数：

app.filter 'orderCollectionBy', ['orderByFilter', (orderByFilter) ->
  (input, attribute, reverse) ->
    return unless angular.isObject input
    if not angular.isArray input
      input = (item for key, item of input)
    orderByFilter input, attribute, reverse
]
于 2014-03-07T21:19:57.713 回答
0

ng-repeat="player in player|orderBy:Level:reverse" 怎么样？

于 2013-11-11T08:34:53.730 回答