ag-grid Set Filter如何单独取消选中筛选列表中的特定值
解答
针对该需求可直接操作Set Filter的内置API实现,无需通过行遍历的方式,具体方案分两种场景:
场景1:初始加载就固定不选中"Argentina"
直接在列定义的filterParams中配置排除规则即可,是最简便的实现方式:
// 对应列的列定义 { field: 'country', // 替换为你实际的字段名 filter: 'agSetColumnFilter', filterParams: { // 动态生成筛选可选值,直接排除"Argentina" values: (params) => { // 从现有行数据中提取所有去重的字段值,过滤掉需要排除的内容 const allValues = [...new Set( params.api.getRowData().map(row => row[params.colDef.field]) )].filter(value => value !== 'Argentina'); params.success(allValues); } } }
原理:Set Filter默认会全选filterParams返回的所有可选值,只要返回的列表本身排除了不需要的"Argentina",初始状态自然不会选中该值,其余值保持默认全选。
场景2:需要动态修改筛选选中状态
如果是表格加载完成后再修改选中值,需要在gridReady事件触发(筛选器初始化完成)后,调用筛选实例API操作:
// gridReady 事件回调 onGridReady(params) { this.gridApi = params.api; this.gridColumnApi = params.columnApi; // 获取对应列的Set Filter实例 const countryFilterInstance = this.gridColumnApi.getColumnFilterInstance('country'); // 拿到筛选器当前所有可选值 const allSelectableValues = countryFilterInstance.getFilterValues(); // 生成排除"Argentina"的选中列表 const selectedValues = allSelectableValues.filter(val => val !== 'Argentina'); // 批量设置筛选选中状态 countryFilterInstance.setModel({ values: selectedValues }); // 触发表格筛选刷新,隐藏对应行 this.gridApi.onFilterChanged(); }
特殊需求扩展
如果需要直接从筛选器的可选列表中隐藏"Argentina"(不仅是不选中,连下拉列表里都不展示),企业版ag-grid可直接用isSelectableValue参数配置:
filterParams: { // 直接禁止"Argentina"出现在可选列表、也无法被选中 isSelectableValue: (value) => value !== 'Argentina' }
踩坑说明
你之前尝试用forEachNode拿不到筛选值是正常的:forEachNode遍历的是表格行数据节点,而非Set Filter内部维护的筛选可选值列表,两者不是同一个数据源,不要混用。
内容的提问来源于stack exchange,提问作者mazin
相关产品推荐
相关产品推荐

