Hey Anna, no worries—let's walk through exactly how to make this work with useExternalFilter. You've got the first piece right, but we need to add two critical functions to your gridOptions to tell ag-Grid which rows to show/hide, plus a way to trigger the filter when needed.

Step 1: Update Your gridOptions with External Filter Logic #

You need to define two key callbacks in gridOptions to implement the filter behavior:

• isExternalFilterPresent: Lets ag-Grid know an external filter is active and should be applied
• doesExternalFilterPass: Determines if a specific row should be displayed (return true to show, false to hide)

Here's the updated configuration:

// Initialize your filter options
this.filterOptions = { useExternalFilter: true };

// Configure gridOptions with external filter functions
this.gridOptions = {
  filterOptions: this.filterOptions,
  enableFilter: true, // Ensure core filtering functionality is enabled
  isExternalFilterPresent: () => {
    // Return true to confirm we have an active external filter
    return true;
  },
  doesExternalFilterPass: (rowNode) => {
    // Only keep rows where flag is NOT true (i.e., flag is false or undefined)
    return !rowNode.data.flag;
  }
};

Step 2: Trigger the Filter When Data Loads or Updates #

Once your data is fetched or if flag values change later, you need to tell ag-Grid to re-evaluate the filter. First, capture the grid API via the gridReady event, then call onFilterChanged() to apply the filter:

// Store the grid API when the grid is ready
onGridReady(params) {
  this.gridApi = params.api;
  // After loading your data, trigger the filter
  this.gridApi.onFilterChanged();
}

// Helper function to refresh the filter if flag values update later
refreshRowFilter() {
  if (this.gridApi) {
    this.gridApi.onFilterChanged();
  }
}

How It All Fits Together #

• isExternalFilterPresent signals to ag-Grid that we're using a custom external filter, so it won't skip our logic
• doesExternalFilterPass runs for every row: if the row's flag is true, we return false to hide it; if flag is false, we return true to keep it visible
• Calling onFilterChanged() forces ag-Grid to re-check all rows against the external filter rules

Quick Troubleshooting Note #

Double-check that you're accessing the row data correctly via rowNode.data—make sure your data objects have the flag property spelled exactly as you expect (it's case-sensitive!).

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