Ag grid Ag grid：计算每个筛选器选择的行数

在我的ag网格中，我想在一组过滤器中的每个过滤器选项旁边显示行数，并可能按该计数对选择进行排序（降序）。 默认情况下是这样的：

我希望选项显示为

• 选择所有（88）
• 凯蒂·泰勒（Katie Taylor）（2）
• 达伦·萨瑟兰（1）
• 约翰·乔·内文（1）
• 巴拉克·奥巴马（0）

---

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

假设列字段为“名称”，您可以尝试构建一个映射，并在过滤器中引用：

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
    }
},

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;
};

最后，

NameFilterCellRenderer

如下所示：

{
    headerName: "Name", 
    field: "name", 
    width: 120,
    filter: 'set',
    filterParams: {
        cellRenderer: 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

对其进行更新（使用新的/更新的数据，或者更新了过滤器等），但这应该适用于您的用例，我认为

检查此解决方案