CODEWITHSUNDEEP
angularag-grid
Sandeep Kumar
Sandeep Kumar

Reputation: 2557

ag-grid cellRenderer failed rendering cell after value evaluation

I have an inline cellRenderer to modify in cell value as below:

cellRenderer: function (params) {
  if(params.value) {
    return params.value * 100;
  }
  return '';
}

I observed in the debug view that it is calculating the value properly. Please find the screenshot enter image description here

But, the moment control moves out of cellRenderer it throws below exception:

ERROR TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
at CellComp.push../node_modules/ag-grid/dist/lib/rendering/cellComp.js.CellComp.afterCellRendererCreated (cellComp.js:582)
at Promise.push../node_modules/ag-grid/dist/lib/utils.js.Promise.then (utils.js:1543)
at CellComp.push../node_modules/ag-grid/dist/lib/rendering/cellComp.js.CellComp.createCellRendererInstance (cellComp.js:564)
at CellComp.push../node_modules/ag-grid/dist/lib/rendering/cellComp.js.CellComp.attachCellRenderer (cellComp.js:589)
at CellComp.push../node_modules/ag-grid/dist/lib/rendering/cellComp.js.CellComp.afterAttached (cellComp.js:100)
at rowComp.js:938
at Array.forEach (<anonymous>)
at RowComp.push../node_modules/ag-grid/dist/lib/rendering/rowComp.js.RowComp.callAfterRowAttachedOnCells (rowComp.js:936)
at RowComp.push../node_modules/ag-grid/dist/lib/rendering/rowComp.js.RowComp.insertCellsIntoContainer (rowComp.js:554)
at RowComp.push../node_modules/ag-grid/dist/lib/rendering/rowComp.js.RowComp.refreshCellsInAnimationFrame (rowComp.js:460)

I have many other such cellRenderer those are working fine. Not sure what's wrong in this particular one. e.g. Below one is working just fine:

cellRenderer: function (params) {
  return params.context.formatDate(params.data.createdDateTime);
}

I am using "ag-grid-enterprise": "^16.0.0", and angular 6.

Upvotes: 3

Views: 3793

Answers (1)

Paritosh
Paritosh

Reputation: 11560

As per @Sh. Pavel's comment, it worked after updating it to return ''+ params.value * 100.

Important thing to understand here is, cellRenderer expects string in return, so that it directly appends it to the DOM.

As what you were returning was a number, proper Node was not getting generated (I guess). Which was solved by doing return '' + params.value * 100;.

Upvotes: 2

Related Questions