AngularJS orderBy子属性不起作用答案

【问题标题】：AngularJS orderBy child property not workingAngularJS orderBy子属性不起作用
【发布时间】：2015-06-05 18:07:46
【问题描述】：

如何按子属性"active" : true 对项目列表进行排序？第一个节点是为每个朋友动态插入的 id。

<li data-ng-repeat="friend in friends|orderBy:'friend.active':true">
        <span class="name">{{friend.name}}</span>
        <span class="phone">{{friend.lastName}}</span>
</li>

$scope.friends = {
    "12345": {
        "name": "Dhiraj",
        "lastName": "Agarwal",
        "active" : false
    },
    "23456": {
        "name": "Poonam",
        "lastName": "Mittal",
        "active" : false
    },
    "34567": {
        "name": "Suresh",
        "lastName": "Bansal",
        "active" : true
    },
    "45678": {
        "name": "Usha",
        "lastName": "Goel",
        "active" : false
    }
};

【问题讨论】：

代替friend.active，你能试试"friend in friends | orderBy: 'active': true"吗？
orderBy 用于数组，而不是对象。

标签： angularjs angularjs-ng-repeat ng-repeat angularjs-orderby

【解决方案1】：

解决方法

http://justinklemm.com/angularjs-filter-ordering-objects-ngrepeat/

和

github.com/fmquaglia/ngOrderObjectBy

创建了一个新的过滤器，然后用于订购它

plnkr : plnkr.co/edit/4eCq7yaVyXGZB8etLZhN?p=preview

<li data-ng-repeat="friend in friends|orderObjectBy:'active':true">

app.filter('orderObjectBy', function() {
  return function(items, field, reverse) {
    var filtered = [];
    angular.forEach(items, function(item) {
      filtered.push(item);
    });
    filtered.sort(function (a, b) {
      return (a[field] > b[field] ? 1 : -1);
    });
    if(reverse) filtered.reverse();
    return filtered;
  };
});

【讨论】：

我发布了另一个解决方案，看看;)

【解决方案2】：

常规 ng-filter orderBy 只接受数组。

使用这种数据效果很好：

 $scope.friends = [{
            "name": "Dhiraj",
                "lastName": "Agarwal",
                "active": false

    },  {
            "name": "Poonam",
                "lastName": "Mittal",
                "active": false

    },{
            "name": "Suresh",
                "lastName": "Bansal",
                "active": true

    }, {
            "name": "Usha",
                "lastName": "Goel",
                "active": false

    }];

jsfiddle demo

编辑：如果您不想使用数组，可以使用此角度 issue 中描述的解决方法

过滤器（未调整并使用下划线）：

app.filter('toArray', function() { return function(obj) {
    if (!(obj instanceof Object)) return obj;
    return _.map(obj, function(val, key) {
        return Object.defineProperty(val, '$key', {__proto__: null, value: key});
    });
}});

示例标记：

<div ng-repeat="val in object | toArray | orderBy:'priority' | filter:fieldSearch">
  {{val.$key}} : {{val}} 
</div>

【讨论】：

在您的解决方案中，您已删除与每个对象关联的键。在我的实现中无法删除这些键。