Ag-grid:计算每个过滤器选择的行数

Question

在我的 ag-grid 中，我想在集合过滤器中的每个过滤器选项旁边显示行数，并可能按该计数(降序)排序选项。这是默认情况下的样子:

我希望选项显示为

• 全选(88)
• 凯蒂·泰勒 (2)
• 达伦·萨瑟兰 (1)
• 约翰·乔·内文 (1)
• 巴拉克·奥巴马 (0)
• ...

考虑到已在其他字段中设置的过滤器(如果有)，从行数据中获取这些计数(并可能相应地对选项进行排序)的最有效方法是什么？

Answer 1

假设您的列字段是“名称”，您可以尝试建立一个 map 并在过滤器 cellRenderer 中引用它:

var nameValueToCount = {};
function updateNameValueCounts() {
    nameValueToCount = {};
    gridOptions.api.forEachNodeAfterFilter((node) => {
        if(!nameValueToCount.hasOwnProperty(node.data.name)) {
            nameValueToCount[node.data.name] = 1;
        } else {
            nameValueToCount[node.data.name] = nameValueToCount[node.data.name] + 1;
        }
    });
}

您的列 def 将如下所示:

{
    headerName: "Name", 
    field: "name", 
    width: 120,
    filter: 'set',
    filterParams: {
        cellRenderer: NameFilterCellRenderer
    }
},

最后，NameFilterCellRenderer 看起来像这样:

function NameFilterCellRenderer() {
}

NameFilterCellRenderer.prototype.init = function (params) {

    this.value = params.value;
    this.eGui = document.createElement('span');
    this.eGui.appendChild(document.createTextNode(this.value + " (" + nameValueToCount[params.value] + ")"));

};

NameFilterCellRenderer.prototype.getGui = function () {
    return this.eGui;
};

您需要确保调用 updateCountryCounts 以在数据更改时更新它(使用新的/更新的数据，或者更新过滤器等)，但这应该适用于您的用例 I想