4

我使用ngGrid来显示我的数据。我想将 cellFilter 和 cellTemplate 一起用于特定列，但似乎它们不能一起使用。当我单独使用 cellFilter 或 cellTemplate 时，它​​们工作得很好。基本上，我想以这种方式格式化单元格的值（例如 500000 --> 500,000；1000000 --> 1,000,000），并且我想用红色制作负值。我该如何解决这个问题？谢谢！

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellFilter: 'number',
                cellTemplate: '<div ng-class="{red: row.getProperty(col.field) < 0}"><div class="ngCellText">{{row.getProperty(col.field)}}</div></div>'
            }]
        }
4

3 回答 3

8

我自己找到了答案：p

就是这么简单。

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellTemplate: '<div ng-class="{red: row.getProperty(col.field) < 0}"><div class="ngCellText">{{row.getProperty(col.field) | number }}</div></div>'
            }]
        }
于 2015-07-08T14:22:11.613 回答
2

由于 ng-grid 现在是 UI-Grid v3.x，引用了 ui-grid/uiGridCell 的默认模板

$templateCache.put('ui-grid/uiGridCell',
  "<div class=\"ui-grid-cell-contents\" title=\"TOOLTIP\">{{COL_FIELD CUSTOM_FILTERS}}</div>"
);

我想说更新后的 UI-Grid 中的 cellTemplate 应该如下：

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellFilter: 'number',
                cellTemplate: '<div class="ui-grid-cell-contents" ng-class="{red: COL_FIELD < 0}">{{COL_FIELD CUSTOM_FILTERS}}</div>'
            }]
        }

您也可以改用该cellClass属性，并将单元格模板保留为默认值。但是，这会将类应用于.ui-grid-cell. 单元格模板会将类应用于 的子级.ui-grid-cell，在我上面的示例中是.ui-grid-cell-contents. 我想，无论哪种方式适合您的情况。

$scope.gridOptions = {
    data: 'data',
    columnDefs: [
        {
            field: 'Settled',
            cellFilter: 'number',
            cellClass: function (grid, row, col, rowRenderIndex, colRenderIndex) {
                var cellVal = grid.getCellValue(row, col);
                return (cellVal < 0) ? 'red' : '';
            }
        }]
}
于 2016-07-01T17:47:40.190 回答
0

根据 Mammadj 的回答，我可以将自己的cellTemplate与cellFilter结合起来。这是我的参考解决方案，其中 executionStatus 是以前用作cellFilter: 'emJobStateLabel'. 这里 executionStatus 通过管道传递给单元格模板中的 emJobStateLabel：

cellTemplate: '<div class="em-row">{{row.entity.executionStatus | emJobStateLabel}} {{row.entity["previewStatus"]==\'New\'?\'\':\'(\'+row.entity.previewStatus+\')\'}}</div>'

不要忘记删除属性 cellFilter。

于 2016-07-01T13:08:09.640 回答