How to filter data in UIGRID if data is mapped using celltemplate

Question

we are using UI GRID to display data and we are using celltemplate in one column to filter data from ID to employee and we have enabled filters for every column.

sampledata:{ID:1 ,salary:3000,Gender:male}

$scope.gridOptions = {
    enableFiltering: true,
    data:sampledata, 
    columnDefs: [{Name:Employeetype, Field:ID,
                cellTemplate: '<div class="ngCellText">                {{row.entity.ID | ID2EMp}}</div>'}
{Name: salary, field:salary}
{Name:Gender field:Gender}]

}

my filter is something like below:

app.filter('ID2EMp', function() {
    return function(text) {
        if (text=='1') {
            return 'Employee';
        }
     if (text=='2')
        return 'Contractor';
    }
});

so now if try to filter grid using UI GRID text filter it wont work if i Type'Employee'/'Contractor' but it will work if i type '1'/'2'..Can anyone please advise how can i make filter work in this situation where i should be able to filter using EMployee keyword.

Also, is there any other way i can manipulate the data to display cell as Employee if ID=1 using filter but not using celltemplate.i have tried with cellfilter but it doesn't seem to work

Kamil Karczewski Kamil Karczewski · Accepted Answer · 2016-09-05T21:39:06

You can do that in two way. Both with cellTemplate. First use filter like always, {{field | filter }} or use right condition in ng-if statement.

Edit:

First cellTemplate: '<div>{{row.entity.field | filter }} </div>' where field is field from variable which you pass to ui-grid as data and filter is just filter.

Second: cellTemplate: '<div ng-if="some_condition">{{row.entity.filed}}</div> where field like in first. And some_condition is a condition statement which rows show.

How to filter data in UIGRID if data is mapped using celltemplate

1 Answers