ui-Raster: Trigger Sortierung in benutzerdefinierten Header-Vorlage

Question

ich folgendes verwenden, um benutzerdefinierte Spaltenüberschriften für mein Raster zu implementieren:

<div role="columnheader"> 
    <table class="table-header-rotated"> 
    <theader> 
     <tr> 
     <th class="op-table-group-heading rotate-45"> 
      <div class="op-table-group-heading-title rotated-container" 
       ng-class="{inclined : col.headerCellClass}"> 
      <span>{{col.headerCellClass}}</span> 
      </div> 
     </th> 
     </tr> 
     <tr> 
     <th class="op-table-asset-heading rotate-45"> 
      <div class="rotated-container colt{{col.uid}}"> 
      <span>{{col.displayName}}</span> 
      </div> 
     </th> 
     </tr> 
    </theader> 
    </table> 
</div> 

jedoch auf diesem Header klicken löst keine Änderung der Sortierung. Ein (wahrscheinlich veralteter) Artikel im Wiki schlägt vor, dazu col.sort() zu verwenden. Dies schlägt jedoch fehl mit v2.sort is not a function.

Ich habe den Quellcode für die aktuellen Standard-Header-Vorlagen in UI-Grid 3 angeschaut. Allerdings kann ich keine darin finden, die das Sortierereignis auslösen würde, so kann ich nur davon ausgehen, dass sie ihre Klick-Listener binden Irgendwas anderes.

Wie kann ich die Sortierung in meiner benutzerdefinierten Vorlage aktivieren?

Answer 1

In Ordnung, also nach dem Sezieren der ursprünglichen Vorlage, scheint es, dass die eine entscheidende Komponente benötigt, um Sortierungen beim Anklicken der Kopfzeile ist ui-grid-cell-contents Klasse. Daher ist die minimale Header-Vorlage, die für die Sortierung verwendet werden kann, einfach <div class="ui-grid-cell-contents"></div>