你如何对AngularFire系列进行排序?

时间:2013-11-20 23:51:07

标签: javascript angularjs firebase angularfire

  $scope.items = [];
  var ref = new Firebase("https://****.firebaseio.com/");
  var query = ref.limit(5);

  angularFire(query, $scope, "items");

<div ng-repeat="item in items" >
<span>{{item.title}}</span>
</div>

你如何按“标题”对这些进行排序?我已经看到了几个类似的问题,但解决方案似乎不起作用,至少在这种情况下。

1 个答案:

答案 0 :(得分:4)

如果$scope.items是一个对象数组(如$scope.items = []暗示的那样),您就可以使用有角度的orderBy filter

<!-- This example will NOT work with Firebase -->
<div ng-repeat="item in items | orderBy:'title'">
  <span>{{item.title}}</span>
</div>

但是,将items设置为数组会产生误导,因为您实际上将“项目”存储(并检索)为键值对列表,一个数组。在javascript中对对象进行排序通常会更复杂,但实现所需的一种方法是自定义过滤器:

app.filter('orderObjectBy', function(){
  return function(input, attribute) {
    if (!angular.isObject(input)) return input;

    var array = [];
    for(var objectKey in input) {
      array.push(input[objectKey]);
    }

    function compare(a,b) {
      if (a[attribute] < b[attribute])
        return -1;
      if (a[attribute] > b[attribute])
        return 1;
      return 0;
    }

    array.sort(compare);
    return array;
  }
});

现在,您可以使用过滤器按任意item属性订购:

<div ng-repeat="item in items | orderObjectBy:'title'">
  <span>{{item.title}}</span>
</div>

这是一个fiddle来演示。正如下面提到的@bennlich,您的自定义过滤器可能会停止在数组转换中,然后您可以使用正常的orderBy过滤器,如建议here

为了彻底,我应该注意,您还可以使用Firebase priorities对“服务器端”进行排序。