Angular 如何为ag网格中的特定行着色？

我有一个ag网格，我只想给一些行号上色。例如，在处理之后，我发现我必须只为第1行、第4行和第5行着色

我尝试了ag grid的getRowStyle函数，但没有成功

gridOptions.getRowStyle = function(params) {
    if (params.node.rowIndex % 2 === 0) {
    return { background: 'red' }
    }
}

下面是一些代码

如果只需要为某些行着色。您需要知道要为哪些行着色。我假设你对此有一个状态。可能是一个名为索引的变量

indices: Array<number> = [1,4,5]; // color these rows

gridOptions.getRowStyle = (params) => { // should use params, not indices in the first braces. Binds the component to this. Can use indices in the function now
    if (this.indices.includes(params.node.rowIndex)) {
        return { background: 'red' }
    }
}

索引：数组=[1,4,5]；//给这些行涂上颜色
gridOptions.getRowStyle=（params）=>{//应该使用params，而不是第一个大括号中的索引。将组件绑定到此。现在可以在函数中使用索引了
if（this.index.includes（params.node.rowIndex））{
返回{background:'red'}
}
}

如果你需要更多的帮助，你需要更加具体。我不知道什么不起作用

。我不确定您是如何在项目中设置所有内容的，但您可能会对如何修改代码以适应我从ag grid文档中调整的示例有一些想法。我希望这个示例有帮助

以下是一些代码

如果只需要为某些行着色。您需要知道要为哪些行着色。我假设你对此有一个状态。可能是一个名为索引的变量

indices: Array<number> = [1,4,5]; // color these rows

gridOptions.getRowStyle = (params) => { // should use params, not indices in the first braces. Binds the component to this. Can use indices in the function now
    if (this.indices.includes(params.node.rowIndex)) {
        return { background: 'red' }
    }
}

索引：数组=[1,4,5]；//给这些行涂上颜色
gridOptions.getRowStyle=（params）=>{//应该使用params，而不是第一个大括号中的索引。将组件绑定到此。现在可以在函数中使用索引了
if（this.index.includes（params.node.rowIndex））{
返回{background:'red'}
}
}

如果你需要更多的帮助，你需要更加具体。我不知道什么不起作用

---

。我不确定您是如何在项目中设置所有内容的，但您可能会对如何修改代码以适应我从ag grid文档中调整的示例有一些想法。我希望示例帮助

您可以尝试一下，因为您希望根据您对行的处理突出显示行，所以应该将一些规则放在下面并突出显示行

gridOptions.rowClassRules: {
  // apply green to 2008
  'rag-green-outer': function(params) { return params.data.year === 2008},

  // apply amber 2004
  'rag-amber-outer': function(params) { return params.data.year === 2004},

  // apply red to 2000
  'rag-red-outer': function(params) { return params.data.year === 2000}
}

---

通过这种方式，您可以根据您的条件为行着色。这仅取自ag gird webporal

你能试试这个吗，因为你想根据你对行的处理突出显示行，所以应该放一些规则如下并突出显示行

gridOptions.rowClassRules: {
  // apply green to 2008
  'rag-green-outer': function(params) { return params.data.year === 2008},

  // apply amber 2004
  'rag-amber-outer': function(params) { return params.data.year === 2004},

  // apply red to 2000
  'rag-red-outer': function(params) { return params.data.year === 2000}
}

---

通过这种方式，您可以根据您的条件为行着色。这仅取自ag gird webporal

看看这个。看起来你已经从那里获取了代码，所以它应该可以工作。请记住，使用您发布的函数只能处理奇数行（而不是第4行）。如果您只需要1、4和5，那么您应该匹配这些索引。如果你能准确地描述什么不起作用，那么就更容易提供帮助了。为什么不添加函数呢？因为没有固定的行索引，你是根据一些规则的处理来决定索引的。看起来你已经从那里获取了代码，所以它应该可以工作。请记住，使用您发布的函数只能处理奇数行（而不是第4行）。如果您只需要1、4和5，那么您应该匹配这些索引。如果你能准确地描述什么不起作用，那么就更容易提供帮助了。为什么不添加函数呢？因为没有固定的行索引，而且你是根据一些规则的处理来决定索引的。我已经看过了，但没有帮助。我需要一个特殊的解决方案，只对像1，3，6这样的几行进行着色。如果您能帮忙的话。谢谢，我尝试了这个解决方案，但似乎数组索引在函数（）中不可读。我尝试了您的解决方案，它给了我这个错误：无法读取getRowStyleYes处未定义的属性索引。我现在看到，

这个

指向的是gridOptions，而不是您的类。我已经更新了我的答案，通过改变函数的调用方式，将组件绑定到该函数，而不是gridOptions。我仍然无法读取未定义错误的属性“Index”。请看这里的plunkr代码：我犯了一个错误。

getRowStyles=（index）=>{}

实际上应该是

getRowStyles=（params）=>{}

。我更新了我的答案，并加了一句话。谢谢，我已经看过了，但没有用。我需要一个特殊的解决方案，只对像1，3，6这样的几行进行着色。如果您能帮忙的话。谢谢，我尝试了这个解决方案，但似乎数组索引在函数（）中不可读。我尝试了您的解决方案，它给了我这个错误：无法读取getRowStyleYes处未定义的属性索引。我现在看到，

这个

指向的是gridOptions，而不是您的类。我已经更新了我的答案，通过改变函数的调用方式，将组件绑定到该函数，而不是gridOptions。我仍然无法读取未定义错误的属性“Index”。请看这里的plunkr代码：我犯了一个错误。

getRowStyles=（index）=>{}

实际上应该是

getRowStyles=（params）=>{}

。我更新了我的答案，并添加了一个plunkr