Angular中如何为AG Grid外部过滤器调用（Filter-）valueGetter函数？

刚好我之前也踩过这个坑，其实AG Grid的行节点（RowNode）自带了两个方法，能直接拿到经过valueGetter或filterValueGetter处理后的值，完美解决你的需求。

核心思路 #

不要直接访问node.data的原始数据，而是用node.getValue(columnKey)或者node.getFilterValue(columnKey)来获取处理后的值：

• node.getValue(columnKey)：会自动触发对应列的valueGetter，返回处理后的结果；如果没设valueGetter，就回退到原始数据。
• node.getFilterValue(columnKey)：优先级更高——先找列的filterValueGetter，没有的话用valueGetter，最后才是原始数据。这完全匹配你的需求：和列过滤器用同一个逻辑处理后的值来做外部过滤。

修改后的代码示例 #

假设你的年龄列的键是'age'，把你的doesExternalFilterPass函数改成这样就行：

function doesExternalFilterPass(node) {
  // 如果你想优先用filterValueGetter的结果，就用getFilterValue
  const processedAge = node.getFilterValue('age');
  // 要是只需要valueGetter的结果，就用getValue：
  // const processedAge = node.getValue('age');

  switch (ageType) {
    case 'below30':
      return processedAge < 30;
    case 'above50':
      return processedAge > 50;
    // 补充你的其他case
    default:
      return true;
  }
}

Angular环境下的小提示 #

如果是在Angular组件里写这个函数，记得把ageType换成组件的属性（用this.ageType），并且用箭头函数保证作用域正确：

doesExternalFilterPass = (node: RowNode) => {
  const processedAge = node.getFilterValue('age');
  switch (this.ageType) {
    case 'below30':
      return processedAge < 30;
    // 其他case...
    default:
      return true;
  }
};

这样改完，你的外部过滤器就会和列过滤器保持一致的逻辑，基于处理后的值来过滤行啦。

内容的提问来源于stack exchange，提问作者Fabian