Search code examples
javascriptangularag-gridag-grid-angularag-grid-ng2

Why is the ag-grid filter comparator not executing?


I'm currently on Angular version 10.2 and ag-grid version 25.3.0

After following the Date Column Custom Filter documentation for ag-grid here, I've decided to apply it to a number column and modify it a bit. Basically, if the user filters by a number less than 0, it should multiple both the filter and the cell value by 100 and compare. If not, then compare the values normally. My specific column definition is as follows:

{
  field: 'roi',
  headerName: 'ROI',
  valueGetter: this.calculateROI.bind(this),
  filter: 'agNumberColumnFilter',
  filterParams: {
    comparator: function(filterValue: number, cellValue: number) {
      console.log(filterValue);
      if (filterValue < 0) {
        filterValue *= 100;
        cellValue *= 100;
      }

      if (cellValue < filterValue) return -1;
      if (cellValue === filterValue) return 0;
      return 1;
    }
  },
  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,
  }
},

The default column definitions also have sortable, filter and resizable all set to true.

My problem is that the comparator function is not even triggering. There is no console logs in the console even though it's the first line in the comparator function. I've checked ag-grid's GitHub issues and other issues on StackOverflow with no success.

There have been a few Stackoverflow issues but those have been with the Column value Comparator and not the comparator inside the filterParams. Any help would be appreciated. Thanks!


Solution

  • If you want to use agNumberComparator you can check the below document. comparator is not a filterparams attribute on here. I think your comparator function is not triggered becouse of this. https://www.ag-grid.com/angular-grid/filter-number/#custom-number-support