Ich habe vier Tabellenüberschriften:

$scope.headers = ["Header1", "Header2", "Header3", "Header4"];

Und ich möchte meine Tabelle sortieren können, indem ich auf die Überschrift klicke.

Also, wenn mein Tisch so aussieht

H1 | H2 | H3 | H4
A    H    D   etc....
B    G    C
C    F    B
D    E    A

und ich klicke auf

H2

mein tisch sieht jetzt so aus:

H1 | H2 | H3 | H4
D    E    A   etc....
C    F    B
B    G    C
A    H    D

Das heißt, der Inhalt jeder Spalte ändert sich nie. Wenn Sie jedoch auf die Überschrift klicken, nach der die Spalten sortiert werden sollen, werden die Zeilen von selbst neu angeordnet.

Der Inhalt meiner Tabelle wird durch einen Datenbankaufruf mit erstelltMojolicious und wird mit zum Browser zurückgeschickt

$scope.results = angular.fromJson(data); // This works for me so far

Der Rest des Codes, den ich zusammengeschustert habe, sieht ungefähr so ​​aus:

<table class= "table table-striped table-hover">
    <th ng-repeat= "header in headers">
        <a> {{headers[$index]}} </a>
    </th>
    <tr ng-repeat "result in results">
        <td> {{results.h1}} </td>
        <td> {{results.h2}} </td>
        <td> {{results.h3}} </td>
        <td> {{results.h4}} </td>
    </tr>
</table>

Wie ordne ich die Spalten von diesem Punkt an an, indem ich einfach auf die Überschrift oben in der Tabelle klicke?