Angular项目中ag-grid的filterParams内comparator未触发如何解决？

核心原因 #

你参考的是日期列过滤器的文档，comparator 是 agDateColumnFilter（日期列过滤器）独有的配置项，agNumberColumnFilter（数字列过滤器）和文本列过滤器的filterParams并不支持该参数，所以你定义的comparator函数完全不会被执行。

可行解决方案 #

方案：继承默认数字过滤器重写比较逻辑 #

该方案可以保留数字过滤器的原有UI和全部交互能力，只修改比较逻辑，适配你的需求：

1. 先自定义继承AgNumberFilter的过滤器类

import { AgNumberFilter } from '@ag-grid-community/angular';
import { IDoesFilterPassParams } from '@ag-grid-community/core';

export class CustomRoiNumberFilter extends AgNumberFilter {
  doesFilterPass(params: IDoesFilterPassParams): boolean {
    // 获取用户输入的过滤值
    const filterValue = this.filterValue as number;
    // 获取当前单元格实际值（兼容valueGetter配置）
    const cellValue = params.getValue(this.colDef.field) as number;

    let processedFilterVal = filterValue;
    let processedCellVal = cellValue;
    // 按需求处理小于0的情况
    if (filterValue < 0) {
      processedFilterVal *= 100;
      processedCellVal *= 100;
    }

    // 匹配原有过滤条件的比较逻辑（大于/小于/等于等）
    const filterCondition = this.filter;
    switch(filterCondition) {
      case 'equals': return processedCellVal === processedFilterVal;
      case 'notEqual': return processedCellVal !== processedFilterVal;
      case 'greaterThan': return processedCellVal > processedFilterVal;
      case 'greaterThanOrEqual': return processedCellVal >= processedFilterVal;
      case 'lessThan': return processedCellVal < processedFilterVal;
      case 'lessThanOrEqual': return processedCellVal <= processedFilterVal;
      default: return super.doesFilterPass(params);
    }
  }
}

2. 修改列定义的filter配置，替换原有默认数字过滤器

{
  field: 'roi',
  headerName: 'ROI',
  valueGetter: this.calculateROI.bind(this),
  filter: CustomRoiNumberFilter, // 替换原来的 'agNumberColumnFilter'
  // 原filterParams.comparator配置可直接删除
  valueFormatter: this.percentFormat.bind(this),
  cellClassRules: {
    'cell-failure': (params: ValueFormatterParams) => params.value < 0,
    'cell-success': (params: ValueFormatterParams) => params.value > 0,
    'cell-even': (params: ValueFormatterParams) => params.value === 0,
  }
}

内容的提问来源于stack exchange，提问作者Qarun Qadir Bissoondial