cellClassここで、角度のUIグリッド

Question

のために働いていない私のコードです：私はcolumnDefs配列からcellClassプロパティを交換するとき、私はcolumnDefs配列にcellClassプロパティを追加するとき

for (var i = 0; i < gridData.length; i++) { 
 
    var currentData = gridData 
 
    $.each(currentData, function(key, value) { 
 
     if (!angular.isFunction(value)) { 
 
      $scope.columnDefs.push({ 
 
       name : key, 
 
       cellClass : 'red', 
 
      }); 
 
     } 
 
    }); 
 
} 
 
$scope.gridOptions = { 
 
    columnDefs : $scope.columnDefs 
 
}; 
 
$scope.gridOptions.data = data;

.red{ 
 
\t background-color: #ff0000; 
 
\t color: #ffffff; 
 
}

<div ng-controller="GridController" id="grid1"> 
 
    <div ui-grid="gridOptions" class="grid"></div> 
 
</div>

それは絶対にうまく働いたが、い私のグリッドはデータを表示しません。 ui-grid domを調べると、私のデータはui-grid cellとバインドされていますが、uiでは表示されません。

Answer 1

単にui.grid.cssにこの2つのCSSクラスをオーバライド

.ui-grid-row:nth-child(odd) .ui-grid-cell { 
 

 
} 
 
.ui-grid-row:nth-child(even) .ui-grid-cell { 
 

 
}

UI-grid.css上記言及CSSクラスから

Answer 2

を背景色のCSSを削除しますcellClassの代わりにcellTemplateを使用してください。

例：

cellTemplate: "<div class='red'>{{COL_FIELD}}</div>"