如何將樣式應用於Angular ui-grid中的排序列？

Question

我有一個狹窄的列的ui網格，當我對這些列應用排序時，不顯示指示排序及其方向的小箭頭。所以我希望能夠根據列排序狀態（asc，desc和none）對列單元格或列標題進行樣式設置。這可能嗎？

這裏顯示三個排序的列的示例屏幕截圖（也注意到菜單圖標是種壞，但這是另一個問題）：

Answer 1

您可以使用「headerCellClass」選項，在你的「columnDefs 」。

文檔是在這裏：http://ui-grid.info/docs/#/tutorial/115_headerCellClass

在你的情況下，它會像：

$scope.gridOptions = { 
    enableSorting: true, 
    columnDefs: [ 
     { 
     field: 'company', 
     headerCellClass: function(grid, row, col, rowRenderIndex, colRenderIndex) { 
      if (col.sort.direction) { 
      return 'red'; 
      } 
     } 
     } 
    ], 
    onRegisterApi: function(gridApi) { 
     $scope.gridApi = gridApi; 
     $scope.gridApi.core.on.sortChanged($scope, function(grid, sort) { 
     $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.COLUMN); 
     }) 
    } 
    }; 

工作Plunker是在這裏：http://plnkr.co/edit/ifQlqkGAEdeELbMqozVE?p=preview