ngGrid cellFilter and cellTemplate do not work together

Question

I use ngGrid to display my data. I would like to use cellFilter and cellTemplate together for the specific column, but seems they do not work together. when I use cellFilter or cellTemplate seperately they work perfect. Basically, I would like to format the value of the cells in this way (e.g 500000 --> 500,000; 1000000 --> 1,000,000) and also I would like to make negative values in a red colour. How can I solve this? Thanks!

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellFilter: 'number',
                cellTemplate: '<div ng-class="{red: row.getProperty(col.field) < 0}"><div class="ngCellText">{{row.getProperty(col.field)}}</div></div>'
            }]
        }

Answer 1

I found the answer myself :p

It is so simple.

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellTemplate: '<div ng-class="{red: row.getProperty(col.field) < 0}"><div class="ngCellText">{{row.getProperty(col.field) | number }}</div></div>'
            }]
        }