2016-04-04 16 views
0

Ich habe dieses Objekt:AngularJS Gruppe von Objekteigenschaft

$scope.items = [{ 
    "category": { "code": "10", "description": "Movies" }, 
     "item": {"code": "421", "description": "Noriko's Dinner Table" } 
        },{ 
    "category": { "code": "10", "description": "Movies" }, 
     "item": {"code": "511", "description": "Avatar" } 
        },{ 
    "category": { "code": "45", "description": "Books" }, 
     "item": {"code": "93", "description": "Divergent" } 
        },{ 
    "category": { "code": "45", "description": "Books" }, 
     "item": {"code": "72", "description": "Sense and Sensibility" } 
        },{ 
    "category": { "code": "33", "description": "TV Shows" }, 
     "item": {"code": "11", "description": "The Walking Dead" } 
        },{ 
    "category": { "code": "33", "description": "TV Shows" }, 
     "item": {"code": "60", "description": "The Bates Motel" } 
        }]; 

und ich versuche, sie zu gruppieren, so dass die Liste sauber und sichtbar organisiert werden kann. Wie folgt aus:

enter image description here

Aber wie Sie sehen können, erscheint die Kategorie Beschreibung auf jedem Punkt. Was mache ich?

<ul> 
    <li ng-repeat="item in items track by $id(item)"><div>{{item.category.description}}</div>{{item.item.description}}</li> 
    </ul> 

LIVE-DEMO: http://plnkr.co/edit/mjek9xPo3ihBTiwW6U0V?p=preview

+0

Ich bin verwirrt - der Plunker sieht genau so aus, wie Sie sagten, Sie versuchen zu erreichen – Maxwelll

+4

http://stackoverflow.com/questions/14800862/how-can-i-group-data-with-anangular-filter – ajmajmajma

Antwort

2

Sie wollen so etwas tun:

<ul ng-repeat="(key, value) in items | groupBy: 'category.description'"> 
{{ key }} 
    <li ng-repeat="item in value"> 
    {{ item.item.description }} 
    </li> 
</ul> 

Nutzen winkelförmigen Stangen in groupBy und filter gebaut.

Verwandte Themen