angular-ui - ng-grid 如何为最后一行设置单独的样式

Question

我试图在 ng-grid 的最后一行显示一些聚合值(如总计)。最后一行的样式和 css 类需要与该列中的其他单元格不同。如何实现这一目标？

列定义中的 cellTemplate 适用于该列中的所有单元格，但在我的情况下，我需要为该列中的最后一行使用不同的样式。任何人都可以请给我建议一个解决方案。

谢谢
苏迪普塔

Answer 1

我能够通过插件将一个类添加到最后一行:

function ngGridAddClassToLastRow(className) {
    var self = this;
    self.grid = null;
    self.scope = null;
    self.init = function (scope, grid, services) {
        self.domUtilityService = services.DomUtilityService;
        self.grid = grid;
        self.scope = scope;
        var addClass = function () {
            var lastRow = self.scope.renderedRows[self.scope.renderedRows.length - 1];
            lastRow.elm[0].className = lastRow.elm[0].className + ' ' + className;
        };
        self.scope.$watch(grid.config.data, addClass);
    };
}

并将此添加到 gridOptions :

...
plugins: [new ngGridAddClassToLastRow('<some class name>'),
...

当然，添加一些 css，例如就我而言:

.lastRow {
    border-bottom: 0px;
}

那对我有用。我不能肯定地说这是要走的路，不用说，我是 Angular 和 ngGrid 的菜鸟。我已经从 flexible height plugin 构建了插件.