angularjs 过滤嵌套数组-使用-checkboxes-with-angularjs

Question

我正在关注this approach 来过滤嵌套的 json 响应。我有一个这样的嵌套属性：

instances:{
     instance:[
     {cname:'name1', location:'pa', price:40, model:'2014' },     
     {cname:'name1', location:'ga', price:30 , model:'2014'},
     {cname:'name1', location:'ga', price:20, model:'2010' }        
    ]}

我可以使用上述示例按顶级属性进行过滤，但不能按子属性进行过滤。 我已经修改了上面的示例以在此处显示我的 json 的嵌套属性。http://jsfiddle.net/jackAndy/qygL2m01/4/。我是 angularjs 的新手。

Answer 1

1. 首先 - 你为什么使用instances.instance？它不是主要的，使用players.instances = [];
2. 数据加载后仅使用Group函数1次；观看过滤器 - 在这种情况下没有必要；

获取过滤器值的函数（我使用underscoreuniq函数，你可以使用你自己的算法）：

$scope.getFieldsValues = function(field){
    var result = [];
    for(var i = 0; i < $scope.players.length; i++){
        result.push($scope.players[i][field]);
    }
    return _.uniq(result);
};

过滤players：

$scope.testFl = function(el){
    for(var filter in $scope.filters){
        var filterArray = [];
        for(var i in $scope.filters[filter]){
            if($scope.filters[filter][i]) filterArray.push(i);
        }

        //You can make array with instances properties & compare with it;
        if(filter === 'location'){
            if(el.instances && el.instances.length > 0){
                var intersection = el.instances.filter(function(n) {
                    return filterArray.indexOf(n[filter]) != -1
                });
            } else if(filterArray.length > 0){return false;}
        } else {
            if(filterArray.length > 0 && filterArray.indexOf(el[filter]) === -1) return false;
        }

    }
    return true;
};

模板：

<li ng-repeat="player in players | filter:testFl" >

过滤实例：

$scope.testFl2 = function(el){
    var filterArray = [];
    for(var i in $scope.filters.location){
        if($scope.filters.location[i]) filterArray.push(i);
    }
    return filterArray.length > 0 && filterArray.indexOf(el.location) === -1 ? false : true;
};

模板：

<span ng-repeat="loc in player.instances | filter:testFl2" >

Fiddle for this;

更新：
计数函数：

$scope.getCount = function(field, value){
    var obj = {};
    obj[field] = value;
    return _.where($scope.players, obj).length;
};

Update fiddle - 更新下划线，增加计数功能；

希望对你有帮助；

已使用答案：
Add underscore to jsfiddle;
variable property name in where underscore.js;