J’essaie de regrouper les éléments dans un ng-repeat en utilisant une condition.
Un exemple de condition est de regrouper tous les éléments avec la même heure.
Les données:
[ {name: 'AAA', time: '12:05'}, {name: 'BBB', time: '12:10'}, {name: 'CCC', time: '13:20'}, {name: 'DDD', time: '13:30'}, {name: 'EEE', time: '13:40'}, ... ]
Le champ ‘time’ est en réalité un horodatage (1399372207) mais avec le temps exact, le résultat de l’exemple est plus facile à comprendre.
Je liste ces articles en utilisant ng-repeat:
{{r.name}}
également essayé avec:
{{r.name}}
Une sortie valide est:
AAA
BBB
CCC
DDD
EEE
Ma dernière option, s’il n’y a pas de solution simple à mon problème, serait de regrouper les données puis de les affecter à la variable d’étendue utilisée dans ng-repeat.
Des pensées?
Vous pouvez utiliser le filtre groupBy du module angular.filter .
vous pouvez donc faire quelque chose comme ceci:
utilisation: collection | groupBy:property
collection | groupBy:property
utiliser une propriété nestede avec une notation par points: property.nested_property
JS:
$scope.players = [ {name: 'Gene', team: 'alpha'}, {name: 'George', team: 'beta'}, {name: 'Steve', team: 'gamma'}, {name: 'Paula', team: 'beta'}, {name: 'Scruath', team: 'gamma'} ];
HTML:
Group name: {{ key }} - player: {{ player.name }}
RÉSULTAT:
Nom du groupe: alpha
* joueur: Gene
Nom du groupe: beta
* joueur: George
* joueur: Paula
Nom du groupe: gamma
* joueur: Steve
* joueur: Scruath
MISE À JOUR: jsbin
Premier groupe dans le contrôleur:
$scope.getGroups = function () { var groupArray = []; angular.forEach($scope.data, function (item, idx) { if (groupArray.indexOf(parseInt(item.time)) == -1) { groupArray.push(parseInt(item.time)); } }); return groupArray.sort(); };
Faites ensuite un filtre pour cela:
myApp.filter('groupby', function(){ return function(items,group){ return items.filter(function(element, index, array) { return parseInt(element.time)==group; }); } }) ;
Puis modifiez le modèle:
{{r.name}}
VOIR DEMO
Juste une solution HTML simple pour les groupes statiques.
Group name: Football - Player Name: {{ player.name }}
Group name: Basketball - Player Name: {{ player.name }}
Sortie:
Nom du groupe: Football
– Nom du joueur: Nikodem
– Nom du joueur: Lambert
Nom du groupe: Basketball
– Nom du joueur: John
– Nom du joueur: Izaäk
– Nom du joueur: Dionisia