3

Setup

html

<ag-grid-angular
  class="ag-theme-alpine"
  [gridOptions]="gridOptions"
  [rowData]="rowData$ | async"
  [getRowNodeId]="getRowId"
  [pagination]="true"
  [paginationAutoPageSize]="true">
</ag-grid-angular>

ts

config

defaultColDef = {
    // make every column use 'text' filter by default
    filter: 'agSetColumnFilter',
    sortable: true,
    rowSelection: "single",
  };

  columnDefs: ColDef[] = [
    { field: 'idTask', width: 320 },
    { field: 'status', width: 90 },
    { field: 'stammNr', width: 115 },
    { field: 'fassungsNr', width: 130 },
    { field: 'aktion', width: 95 },
    { field: 'user', width: 300, floatingFilter: true },
    { field: 'workflow', width: 130 },
    { field: 'erstellt', width: 240, initialSort: "desc" },
    { field: 'retry', width: 240 }
  ];

  gridOptions = {
    defaultColDef: {
      sortable: true,
      filter: true,
    },
    columnDefs: this.columnDefs,
    animateRows: true,
  };

rowData

this.rowData$ = this.store.select(store => store.doctrans.entities);

getRowId

  getRowId = (params) => {
    return params.idTask;
  }

What works

The table works fine. The rows get updated as the data in ngrx gets updated.

Problem

When i use a filter it gets resetted as soon as the data is updated. Seems the whole grid gets rendered when the rowData$ Observable changes

Question

What to change to the filter options stay?

Update 1

As statet here: Column filter lost when updating row data in ag-grid the gridOption "deltaRowDataMode: true" should be used. And it works. But in the comment it says it deprecated and https://www.ag-grid.com/javascript-data-grid/immutable-data/ should be used. But this seems to be deprecated too.

Solution

Solved my problem.

As stated here: https://www.ag-grid.com/javascript-data-grid/data-update-row-data/, if you provide a row-id only the rows who changed should be updated. This didnt work for me and now i know why. Here: https://ag-grid.com/changelog/?fixVersion=27.1.0 if you search for immutable you find "27.1.0 Replace getRowNodeId() with getRowId() to make a) immutable data the default and b) provide more info in params". I installed my ag-grid-community bevor 15.03 (version 27.1) and so getRowId() didnt work.

I updated to version 27.1.0 and everything works now. I just need to set the rowId with:

gridOptions = {
    // other options
    getRowId: (params) => params.data.idTask,
  };

and the grid just updated the rows which have changed.

Hesk
  • 307
  • 4
  • 16

0 Answers0