How to change color of ag-grid cells for dynamically changing data

Question

I have a table that loads from dynamically changing data. It refreshes every 5 secs. I'm using ag-grid for it using this example: https://www.ag-grid.com/javascript-grid-sorting/index.php

Is it possible to change color of the cells whose values have changes, like suppose a cell value is 100 and it becomes (less than this i.e. <100) so make the cell red color, id it becomes greater, make it green color. I'm trying to do it using this example: https://www.ag-grid.com/javascript-grid-cell-styling/index.php

But I can't understand how to do this.

UPDATE: I'm doing it this way, but it's not changing the color:

var columnDefs = [
    {headerName: "Arr Px Slippage", field: "total_wt_arr_slp", width: 100, newValueHandler: compareValues},
    {headerName: "IVWAP Slippage", field: "total_wt_ivwap_slp", width: 100}


];

function compareValues(params) {
    if (params.oldValue > params.newValue){ 
    return {color: 'green', backgroundColor: 'black'};
    console.log(params.newValue);

    }
    if (params.oldValue < params.newValue){ 
    return {color: 'red', backgroundColor: 'black'};
    }
}

Answer 1

Actually I just got mine working. You need "cellClassRules" attribute on each column where you want to change the color. Something like:

{headerName: "header", field:"field",suppressMenu: true, volatile: true, suppressMovable: true, cellClassRules: {'bold-and-red': 'x>1'} }

Here 'x' in the rule is the value of the column. Also, you need to mark your column as voaltile: true.
For volatile fields to dynamically change, you need api.softRefreshView() while you are refreshing the data.
The css class 'bold-and-red'can be defined in your html file like: .bold-and-red { color: darkred; font-weight: bold; }

Answer 2

Here is the snippet of code where you can change the color of the ag grid cell text and background color.

 var colDef = {
            name: 'Dynamic Styles',
            field' 'dummyfield',
            cellStyle: function(params) {
                if (params.node.value=='Police') {
        //Here you can check the value and based on that you can change the color
                    //mark police cells as red
                    return {color: 'red', backgroundColor: 'green'};
                } else {
                    return null;
                }
            }
        }