cellClass 不适用于 angular ui 网格

Question

这是我的代码：

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{
 background-color: #ff0000;
 color: #ffffff; 
}

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

当我从 columnDefs 数组替换 cellClass 属性时它绝对工作正常但是当我将 cellClass 属性添加到 columnDefs 数组时我的网格不显示数据。在检查 ui-grid dom 时，我的数据与 ui-grid cell 绑定但未出现在 ui.

上

Answer 1

只需覆盖 ui.grid.css

中的这两个 css class

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

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

}

从上面提到的 css class 中删除背景颜色 css ui-grid.css

Answer 2

使用 cellTemplate 而不是 cellClass。

示例：

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

cellClass 不适用于 angular ui 网格

cellClass is not working for angular ui grid

javascript

css

angularjs

angular-ui-grid

ui-grid