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

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="player in プレーヤー | orderObjectBy:'Level'"

于 2013-11-11T22:07:38.303 に答える
1

並べ替えはOKだと思います。私は簡単な例を行いましたが、それはあなたのやり方で機能します。配置していないものがコードに間違っている可能性があります (最初に 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}]
}

プランカーの例

于 2013-11-11T08:35:58.350 に答える
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 inplayers|orderBy:Level:reverse" はどうですか?

于 2013-11-11T08:34:53.730 に答える