Wie kann ich Artikel nach Datum in Smart-Tabelle sortieren

Question

Wie kann ich Daten nach Datum in Smart-Tabelle sortieren? Mit St-Sort ist es nicht so gut.

<table st-table="displayedCollection" st-safe-src="playerCollection" class="table table-hover"> 
     <thead> 
     <tr> 
      <th st-sort="id" class="hover">Id</th> 
      <th st-sort="firstname" class="hover">Jméno</th> 
      <th st-sort="lastname" class="hover">Příjmení</th> 
      <th st-sort="registrationDate" class="hover">Datum registrace</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr ng-repeat="player in displayedCollection"> 
      <td class="hover">{{player.id}}</td> 
      <td class="hover">{{player.firstname}}</td> 
      <td class="hover">{{player.lastname}}</td> 
      <td class="hover">{{player.registrationDate}}</td> 
     </tr> 
     </tbody> 
    </table> 

Vielen Dank für die Antworten.

Answer 1

einen Auftrag hinzu, indem auf Ihre ng-repeat wie folgt aus:

<tr ng-repeat="player in displayedCollection | orderBy:'registrationDate'"> 
    <td class="hover">{{player.id}}</td> 
    <td class="hover">{{player.firstname}}</td> 
    <td class="hover">{{player.lastname}}</td> 
    <td class="hover">{{player.registrationDate}}</td> 
</tr> 

Für onclick Sortierung Sie eine Variable auf den Umfang hinzufügen könnte, die die Sortierung und verwendet, dass auf der orderBy auf dem ng-repeat bestimmt.

Etwas wie folgt aus:

<table st-table="displayedCollection" st-safe-src="playerCollection" class="table table-hover"> 
    <thead> 
    <tr> 
     <th st-sort="id" class="hover"><a href="" ng-click="predicate = 'id'; reverse=false">Id</a></th> 
     <th st-sort="firstname" class="hover"><a href="" ng-click="predicate = 'firstname'; reverse=false">Jméno</a></th> 
     <th st-sort="lastname" class="hover"><a href="" ng-click="predicate = 'lastname'; reverse=false">Příjmení</a></th> 
     <th st-sort="registrationDate" class="hover"><a href="" ng-click="predicate = 'registrationDate'; reverse=false">Datum registrace</a></th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="player in displayedCollection | orderBy:predicate:reverse"> 
     <td class="hover">{{player.id}}</td> 
     <td class="hover">{{player.firstname}}</td> 
     <td class="hover">{{player.lastname}}</td> 
     <td class="hover">{{player.registrationDate}}</td> 
    </tr> 
    </tbody> 
</table> 

habe ich eine Plunker dafür. Wenn Sie auf eine Spaltenüberschrift klicken, wird die Tabelle nach dieser Spalte sortiert. Ich hoffe, es hilft.

http://plnkr.co/edit/pAJ3PpRwVk7PuTmoMjsr?p=preview

Answer 2

Es normalerweise (siehe Dokumentation Website) funktionieren soll. Allerdings, wenn Ihr Anmeldetag eine Datumszeichenfolge ist, sollten Sie einen Getter verwenden das Datum Objekt Version davon zurückzukehren, sonst werden Sie die alphanumerische haben, um

in Ihrem Controller

$scope.getters = { 
    registrationDate:function(row) { 
     return new Date(row.registrationDate); 
    } 
} 

so können Sie Ihre binden Header zu diesem Getter

<th st-sort="getters.registrationDate">Datum registrace</th> 

Answer 3

Ich werde eine weitere mögliche Lösung im Zusammenhang mit @ Laurent Antwort hinzufügen. Seine Lösung funktionierte nicht in meinem Fall also habe ich ein bisschen den Getter:

$scope.getters = { 
    registrationDate:function(row) { 
     return (new Date(row.registrationDate)).getTime(); 
    } 
} 

getTime() gibt die Anzahl der Millisekunden seit 1970.01.01, so wird die Spalte von Nummer statt Datum bestellt werden (es funktionierte nicht in meinem Fall und ich habe nicht herausgefunden, warum) und das Ergebnis ist das gleiche.