我可以使用cellRendererSelector为每一行赋予自己的cellRenderer

Question

我正在尝试解决此问题：
Can you specify a different customCellRenderer to different rows in ag-grid Angular

在文档中，我发现了一些可能会有所帮助的内容：
https://www.ag-grid.com/javascript-grid-cell-rendering/

在示例中：

  

许多渲染器一列

他们展示了一些与我的需求相似的东西。
请看一下plunker项目：

https://plnkr.co/edit/P5suHbMjjVH3knho3B7n?p=preview

在此特定部分：

cellRendererSelector:function (params) {
            var moodDetails = {
                component: 'moodCellRenderer'
            };

            var genderDetails = {
                component: 'genderCellRenderer',
                params: {values: ['Male', 'Female']}
            };

            if (params.data.type === 'gender')
                return genderDetails;
            else if (params.data.type === 'mood')
                return moodDetails;
            else
                return null;

        }

这样工作：

在他们的示例中，他们基于在同一行的另一列中选择的值来呈现单元格。
凭直觉，我尝试了以下操作：

 if (params.node.id === 1)
                return genderDetails;
            else if (params.node.id === 5)
                return moodDetails;
            else
                return null;

        }

我认为那应该行得通。但是，您没有看到它：

知道为什么它不起作用。
谢谢！

Answer 1

您几乎明白了！

该代码的唯一问题是node.id的类型为string，而您尝试将它们与number进行比较。

要修复此问题，请更新cellRendererSelector条件以测试字符串：

if (params.node.id === '1')
    return genderDetails;
else if (params.node.id === '5')
    return moodDetails;
else
    return null;

---

请注意，宽大的比较也可以：

if (params.node.id == 1)
    // and so on...

…，因为在比较之前，数字将被强制转换为字符串。 不过我建议您不要这样做，以后忘记了为什么将==放在第一位的时候，它可能会成为一个陷阱：）