Sortierung für viele gleiche Tabelle in Angular

Question

Ich versuche, die gleiche Struktur Tabelle, sondern verschiedene Daten mit Angular zu sortieren. Das Plunker-Beispiel kann sehen here

Das Problem ist, wie kann ich nur für eine bestimmte Tabelle nicht für die ganze Tabelle sortieren. Ich denke, dass ich das Ergebnis erreichen kann, indem ich neue Variablen mache, um unterschiedliche Werte für verschiedene Tabellen zu speichern, aber es gibt alternative und effiziente Möglichkeiten, dies zu tun.

Probendaten:

$scope.friends = 
    [{name:'John', phone:'555-1212', age:10}, 
    {name:'Mary', phone:'555-9876', age:19}, 
    {name:'Mike', phone:'555-4321', age:21}, 
    {name:'Adam', phone:'555-5678', age:35}, 
    {name:'Julie', phone:'555-8765', age:29}]; 

$scope.close_friends = 
    [{name:'Alan', phone:'555-1212', age:21}, 
    {name:'Jen', phone:'555-9876', age:29}, 
    {name:'David', phone:'555-4321', age:24}, 
    {name:'Raya', phone:'555-5678', age:25}, 
    {name:'Brok', phone:'555-8765', age:28}]; 

$scope.very_close_friends = 
    [{name:'Peter', phone:'555-1212', age:41}, 
    {name:'Beck', phone:'555-9876', age:39}]; 

Answer 1

Ohne die Verwendung der Ordnungsfunktion:

<table class="friend"> 
    <tr> 
    <th> 
     <button ng-click="reverse1=!reverse1; predicate = 'name'">Name</button> 
     <span class="sortorder" ng-if="predicate === 'name'" ng-class="{reverse:reverse1}"></span> 
    </th> 
    <th> 
     <button ng-click="reverse1=!reverse1; predicate = 'phone'">Phone Number</button> 
     <span class="sortorder" ng-if="predicate === 'phone'" ng-class="{reverse:reverse1}"></span> 
    </th> 
    <th> 
     <button ng-click="reverse1=!reverse1; predicate = 'age'">Age</button> 
     <span class="sortorder" ng-if=" predicate === 'age'" ng-class="{reverse:reverse1}"></span> 
    </th> 
    </tr> 
    <tr ng-repeat="friend in friends | orderBy:predicate:reverse1"> 
     <td>{{friend.name}}</td> 
     <td>{{friend.phone}}</td> 
     <td>{{friend.age}}</td> 
    </tr> 
    </table> 

Plunker: https://plnkr.co/edit/zxPOX41fkcKWsA3xRSW7?p=preview

Answer 2

schreiben orderBy Eigenschaft jeder Anordnung und Reihenfolge von dieser Eigenschaft in der ng-Wiederholung.

Wenn Sie wirklich alle Arten von ähnlichen Listen wie diese haben, würde ich empfehlen, die Erstellung einer Richtlinie oder Komponente dafür zu untersuchen. Es wird viel effizienter sein.