2016-03-25 38 views
7

Sto utilizzando il filtro groupByAngular-Filter.Posso raggruppare per più campi usando Filtro angolare?

Esempio da GitHub:

$scope.players = [ 
    {name: 'Gene', team: 'alpha'}, 
    {name: 'George', team: 'beta'}, 
    {name: 'Steve', team: 'gamma'}, 
    {name: 'Paula', team: 'beta'}, 
    {name: 'Scruath', team: 'gamma'} 
]; 

<ul> 
    <li ng-repeat="(key, value) in players | groupBy: 'team'"> 
    Group name: {{ key }} 
    <ul> 
     <li ng-repeat="player in value"> 
     player: {{ player.name }} 
     </li> 
    </ul> 
    </li> 
</ul> 

Così, i gruppi esempio la collezione giocatori dalla squadra . Immaginate c'è un proprietà età per ogni oggetto giocatore:

$scope.players = [ 
    {name: 'Gene', team: 'alpha', age: 19}, 
    {name: 'George', team: 'beta', age: 19}, 
    {name: 'Steve', team: 'gamma', age: 23}, 
    {name: 'Paula', team: 'beta', age: 23}, 
    {name: 'Scruath', team: 'gamma', age: 23} 
]; 

Voglio gruppo da squadra e età. Come lo posso fare?

+0

Hai provato solo aggiungendo un altro gruppo da? –

+0

Quali sono i risultati attesi? Che cosa hai provato? Sembra un nidificato 'groupBy' farebbe quello che ti serve – charlietfl

risposta

13

Seguite l'esempio di più campi

angular.module('app',['angular.filter']) 
 
    .controller('MainController', function($scope) { 
 
    $scope.players = [ 
 
     {name: 'Gene', team: 'alpha', age: 19}, 
 
     {name: 'George', team: 'beta', age: 19}, 
 
     {name: 'Steve', team: 'gamma', age: 23}, 
 
     {name: 'Paula', team: 'beta', age: 23}, 
 
     {name: 'Scruath', team: 'gamma', age: 23} 
 
    ]; 
 
});
<!DOCTYPE html> 
 
<html ng-app="app"> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.4.7/angular-filter.js"></script> 
 
    
 
<meta name="description" content="[groupBy example]"/> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <div ng-controller="MainController"> 
 

 
<ul ng-repeat="(key, value) in players | groupBy: '[team,age]'"> 
 
    <b>Group name: {{key}}</b> 
 
    <br> 
 
    <li ng-repeat="player in value"> 
 
    <b>player:</b> {{ player.name }} 
 
    <br> 
 
    <b>team:</b> {{player.team}} 
 
    <br> 
 
    <span ng-if="player.age"><b>age:</b> {{ player.age }}</span> 
 
    </li> 
 
</ul> 
 
    </div> 
 
</body> 
 
</html>

+0

Come accedi alla chiave multipla separatamente nel tuo html? La chiave sembra diventare una stringa di "squadra, età" ho bisogno di dividerlo? {{key.team}} non è definito. ecc. –

+0

Per rispondere al mio commento: '{{value [0] .team}}' e '{{value [0] .age}}' farà il trucco. Con un groupby dovresti essere in grado di contare almeno una riga per "team" e "age" (o gruppo) esistenti, quindi non è necessario controllare "count> 0". Lungi dall'essere elegante ma dovrebbe funzionare ed essere affidabile. Vorrei che la chiave diventasse json o qualcosa del genere quando si utilizza più campi per la chiave. –

2

provare la seguente Io parto dal presupposto che si desidera i gruppi per essere creati utilizzando più valori come criteri

ng-repeat="(key, value) in players | groupBy: '[team,age]'" 
+0

Questo non fornisce una risposta alla domanda. Una volta che hai [reputazione] sufficiente (http://stackoverflow.com/help/whats-reputation) sarai in grado di [commentare qualsiasi post] (http://stackoverflow.com/help/privileges/comment); invece [fornisci risposte che non richiedono chiarimenti da parte del richiedente] (http://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can- i-do-, invece). - [Dalla recensione] (/ recensione/post di bassa qualità/11993005) – Alexei

+0

scusate. Sto solo cercando di dare una mano –