valueGetter is not reflecting in rowdata ag-gird

Question

I am using ag-grid community version for my development. I came across valuegetter to render the cell data on the fly.

But it is not reflecting in the row data variable.

Below is my columndef

columnDefs = [
    { headerName: 'Student Name', field: 'name' },
    { headerName: 'English', field: 'english' },
    { headerName: 'Maths', field: 'maths' },
    { headerName: 'Science', field: 'science' },
    {
      headerName: 'Total',
      field: 'total',
      valueGetter: params => {
        let totalValue = 0;
        totalValue =
          parseInt(params.data.english) +
          parseInt(params.data.maths) +
          parseInt(params.data.science);
        return totalValue;
      }
    }
  ];

Below is my row data

rowData: StudentData[] = [
    { name: 'Rajesh', english: '10', maths: '21', science: '0', total: null }
  ];

Where I am doing the total on the fly.

But when i am trying to access the total in my row data it is not reflecting

onSave(): void {
    console.log(this.rowData[0].total);
  }

The console is printing null instead of 31

Below is my StackBlitz URL.Please help me to get the value getter value in row data model

https://stackblitz.com/edit/angular-ivy-vkppt6?file=src%2Fapp%2Fapp.component.ts

Zunayed Shahriar Zunayed Shahriar · Accepted Answer · 2021-08-10T15:38:02

You were only getting (presenting) the processed data.

You have to assign the data to the respective column's field/property.

So, in ValueGetter add:

params.data.total = totalValue;

Working demo

valueGetter is not reflecting in rowdata ag-gird

1 Answers