Date Filter in ag grid angular

Question

I'm tring to create a date filter for my grid made using ag grid in angular.

My code is as follow:

    {
      field: 'data_determina',
      headerName: 'Data determina',
      cellDataType: 'date', 
      filter: "agDateColumnFilter",
      filterParams : {
        /* filterOptions: ['equals', 'greaterThan', 'lessThan', 'inRange'] */
      },
      valueFormatter: (params: any) => {
        if (params && params.value) {
          return moment(params.value).format('DD/MM/YYYY');
        }
        return null;
      },

    },

Can someone explain to me why the dates are not being filtered?

Answer 1

Add filter params

var filterParams = {
  comparator: (filterLocalDateAtMidnight, cellValue) => {
    var dateAsString = cellValue;
    if (dateAsString == null) return -1;
    var dateParts = dateAsString.split('/');
    var cellDate = new Date(
      Number(dateParts[2]),
      Number(dateParts[1]) - 1,
      Number(dateParts[0])
    );

    if (filterLocalDateAtMidnight.getTime() === cellDate.getTime()) {
      return 0;
    }

    if (cellDate < filterLocalDateAtMidnight) {
      return -1;
    }

    if (cellDate > filterLocalDateAtMidnight) {
      return 1;
    }
    return 0;
  },
  minValidYear: 2000,
  maxValidYear: 2021,
  inRangeFloatingFilterDateFormat: 'Do MMM YYYY',
};

Change your column definition like that

{
  field: 'data_determina',
  headerName: 'Data determina',
  filter: "agDateColumnFilter",
  filterParams: filterParams,
},

Example: https://plnkr.co/edit/0VMVQa7nBagrqeWp?preview