2016-08-01 2 views
0

У меня есть список, который имеет двухуровневую группировку. Как я могу получить доступ к фильтру второго уровня с первого?Доступ к фильтру в двухуровневой группировке в угловом JS

<div ng-repeat="(key1, value1) in list| groupBy: 'group1'"> 
    <!--i want to access 'filtered' here--> 
    {{ key1 }} 
    <div ng-repeat="(key2, value2) in value1 | groupBy : 'group2'" ng-show="filtered.length > 0"> 
    {{ key2 }} 
    <div ng-repeat="item in value2 | filter : ...some filters } as filtered"> 
     <div class="collapse-detail-detail"> 
     {{ item.Name }} 
     </div> 
    </div> 
</div> 

Я хочу получить доступ к «фильтруются» на первом уровне, потому что я хочу, чтобы скрыть всю группу, когда нет никаких пунктов под него после фильтра.

Например, у меня есть этот список:

[ 
{name:"Kevin Durant", team: 1, : homeTown: 1}, 
{name:"Dwayne Wade", team: 2, homeTown: 1}, 
{name:"Lebron James", team: 2, homeTown: 2}, 
{name:"Kyrie Irving", team: 2, homeTown: 2}, 
{name:"Damian Lillard", team: 1, homeTown: 3} 
] 

группировка по команде и родному городу приведет к

team 1 
    homeTown 1 
    Kevin Durant 
    homeTown 3 
    Damian Lillard 
team 2 
    homeTown 1 
    Dwayne Wade 
    homeTown 2 
    Lebron James 
    Kyrie Irving 

если вы будете фильтровать все, кто принадлежит к команде 1, вы получите:

team 1 
    homeTown 1 
    Kevin Durant 
    homeTown 3 
    Damian Lillard 
team 2 
    homeTown 1 
    homeTown 2 

, но в результате я хочу

team 1 
    homeTown 1 
    Kevin Durant 
    homeTown 3 
    Damian Lillard 
+1

Добавить для 'структура данных list', которые могут помочь понять проблему наилучшим образом. – sabithpocker

+0

@rajeemcariazo, см. Ответ, его рабочий –

ответ

1

Попробуйте это. Его работа, вы можете использовать модуль angular.filter для группировки массивов. angular.filter

var app = angular.module('plunker', ['angular.filter']); 
 

 
app.controller('MainCtrl', function($scope) { 
 
$scope.list = [ 
 
{name:"Kevin Durant", team: 1, homeTown: 1}, 
 
{name:"Dwayne Wade", team: 1, homeTown: 1}, 
 
{name:"Lebron James", team: 1, homeTown: 2}, 
 
{name:"Kyrie Irving", team: 1, homeTown: 2}, 
 
{name:"Damian Lillard", team: 1, homeTown: 3} 
 
] 
 
});
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <meta charset="utf-8" /> 
 
    <title>AngularJS Plunker</title> 
 
    <script>document.write('<base href="' + document.location + '" />');</script> 
 
    <link href="style.css" rel="stylesheet" /> 
 
    <script data-semver="1.4.9" src="https://code.angularjs.org/1.4.9/angular.js" data-require="[email protected]"></script> 
 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.1/angular-filter.js"></script> 
 
    
 
    <script src="app.js"></script> 
 
    </head> 
 

 
    <body ng-app="plunker" ng-controller="MainCtrl"> 
 
    <ul ng-repeat="(key, value) in list | groupBy: 'team'"> 
 
     Team: {{ key }} 
 
      
 
     <ul ng-repeat="(key, value) in value | groupBy: 'homeTown'"> 
 
     <span>HomeTown: {{ key }}<span> 
 
     <div style="margin-left:10px;"> <span ng-repeat="subValue in value">{{subValue.name}}{{($index < value.length - 1 ? ", " : "")}}</span></div> 
 
    
 
     </ul> 
 
     </ul> 
 
    </body> 
 

 
</html>

+0

это не отвечает на мой вопрос, мой вопрос в том, как я могу удалить группы, у которых нет элементов после фильтра – rajeemcariazo

+0

@rajeemcariazo Я обновил json со всем, что касается команды team1, ее работы. Вы ищете любое другое решение? –

Смежные вопросы