ui-grid dynamic cellFilter

Question

Using ui-grid I'd like to have a column with a dynamic cellFilter, so it can be updated, for example from 'number' to 'currency'. I tried changing the parameter cellFilter from the column but it doesn't reflect in the grid. I tried also reference the cellFilter to a variable like cellFilter: col.colDef.filter but get the error

Error: [$parse:syntax] Syntax Error: Token '.' is an unexpected token at column 33 of the expression [grid.getCellValue(row, col) |col.colDef.filterFormat] starting at [.colDef.filterFormat].

plunkr: http://plnkr.co/edit/KhR4kbLAT61vAm6AlSCr?p=preview Any suggestion?

Anything else I can do to get a "useful" or "accepted" response below? — Tim Harker, Mar 23 '17 at 14:14

score 0 · Accepted Answer · answered Mar 15 '17 at 16:41

This should do it for you, a small tweak that makes use of angular.copy():

var app = angular.module('app', ['ui.grid']);
app.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
  $scope.gridOptions1 = {
    enableFiltering: true,
    columnDefs: [{
      field: 'age',
      cellFilter: 'currency'
    }]
  };

  $scope.gridOptions = angular.copy($scope.gridOptions1);
  $http.get('//cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
    .success(function(data) {
      $scope.gridOptions.data = data;
    });

  $scope.updateFilter = function() {
    $scope.gridOptions1.columnDefs[0].cellFilter = 'number';
    $scope.gridOptions = angular.copy($scope.gridOptions1);
  };
}]);

Here's a working Plunker, http://plnkr.co/edit/p3pBKvFH3pJcpps02sN9?p=preview.

Let me know if you need anything else. Happy to help further.

You got it. Make use of AngularJS glory! – Tim Harker Mar 23 '17 at 18:54 — Tim Harker, Mar 23 '17 at 18:54

ui-grid dynamic cellFilter

1 Answers1