Angular ag grid valueGetter

Question

i am trying to make ag grid table. Basically i have about 8 columns. 3 of them are user inputs and the rest are just mathematical calculations based on some equations.

i figured valueGetter will be a good place to put them (calculations), but for one cell i need to get data from different row and trouble starts there.

this is my column definition, and valueGetter for field x is working fine because it's using data from the same row, but, for field xixi i have to get data from the previous row. i have tried with gridApi but ofc its undefined. pls help

  columnDefs: ColDef[]=[
    {field: 'r', width:150, cellEditor: 'agRichSelectCellEditor'},
    {field: 'y', width:150, cellEditor: 'agRichSelectCellEditor'},
    {field: 'x', width:150, valueGetter: function (params) {
      return params.data.r * params.data.y;
    }},
    {field: 'xixi', width:150, valueGetter: function (params){
      if(params.node.rowIndex == 0) {return 0;}
      let indexBefore = params.node.rowIndex
      if(this.gridApi == undefined){return;}
      let dataBefore = this.gridApi.getDisplayedRowAtIndex(indexBefore-1);
      let data = params.data.x - dataBefore.x;
      return data;}},
    {field: 'koef', width:150, cellEditor: 'agRichSelectCellEditor'},
    {field: 'proizvod', width:150},
    {field: 'deltaY', width:190},
    {field: 'delta4y', width:150},
    {field: 'proizvodSum', width:150},
  ]

sorry, how to ag grid read previous row data. I try to check data `params..node.rowIndex` that value `0` and `1`, then `this.gridApi.getDisplayedRowAtIndex` not found that value `getDisplayedRowAtIndex` in ag grid — ilham doang, Jan 05 '22 at 03:56
yes, gridApi is undefined because it is initialized in onGridReady but calumnDefs is being called before that. — Stefan Ivovic, Jan 05 '22 at 08:49

score 1 · Accepted Answer · answered Jan 05 '22 at 13:23

1

There are a few solutions to your problem, easiest solution would be to use the grid API that is available in the params parameter within your valueGetter.

Use the following code for your 'xixi' columnDef:

{
      field: 'xixi',
      width: 150,
      valueGetter: function (params) {
        if (params.node.rowIndex == 0) {
          return 0;
        }
        let indexBefore = params.node.rowIndex;
        if (params.api == undefined) {
          console.log('her');
          return;
        }
        let dataBefore = params.api.getDisplayedRowAtIndex(indexBefore - 1);
        let data = params.data.x - dataBefore.data.x;
        return data;
      },

Demo.

answered Jan 05 '22 at 13:23

ViqMontana

5,090
3
19
54

i am getting Uncaught Error: AG Grid: cannot get grid to draw rows when it is in the middle of drawing rows. Your code probably called a grid API method while the grid was in the render stage. To overcome this, put the API call into a timeout, e.g. instead of api.refreshView(), call setTimeout(function() { api.refreshView(); }, 0). To see what part of your code that caused the refresh check this stacktrace. – Stefan Ivovic Jan 05 '22 at 14:04
are you getting the error in the demo? If not, you've made a mistake in your code somwhere. – ViqMontana Jan 05 '22 at 14:11

Angular ag grid valueGetter

1 Answers1