Ui-Grid - 更改背景颜色单元格相同的值

Question

我正在使用 angular UI-grid 并且我需要保持相同的背景颜色，同时值等于之前的行。当值不同时，我需要合并颜色，如下例：

我正在尝试使用 cellClass 执行此操作，但是当用户使用滚动时，rowRenderIndex 的值发生更改，我丢失了引用。

cellClass: function (grid, row, col, rowRenderIndex, colRenderIndex) {
   ...
}

如何获取当前行前一行的值和 class？

我创建了一个 plunker 作为示例。在这个 plunker 中，我想根据前一个字段的值更改列 age 的颜色。如果值相等，则颜色需要相同，但如果值不同，则颜色也需要不同。例如，如果您导航到第 38 行，则线条的颜色会在滚动过程中发生变化。

Plunker

Answer 1

这应该让你相当接近。

这是来自控制器的相关代码：

var currentAge = 0;
var previousStyle = 'group2';
$scope.gridOptions.columnDefs = [
  {name:'id'},
  {name:'name'},
  {field:'age',
    cellClass: function (grid, row, col, rowRenderIndex, colRenderIndex) {
        var newStyle;
        if (currentAge != row.entity.age) {
          if (previousStyle == 'group2') {
            previousStyle = '';
            newStyle = 'group2';
          } else {
            previousStyle = 'group2';
            newStyle = 'group1';
          }
        } else {
          if (previousStyle == 'group2') {
            newStyle = 'group1';
          } else {
            newStyle = 'group2';
          }
        }
        currentAge = row.entity.age;
        return newStyle;
      }
    },
  {name: 'address.city'}
];

这是您的 Plunker 更新，http://plnkr.co/edit/gxMGCJTgjVpiY3zRVq0g?p=preview。

如果您有任何问题，请告诉我。

Ui-Grid - 更改背景颜色单元格相同的值

Ui-Grid - Change background color cells same value

angular-ui-grid