ngTable filter with comma separated

I have created an application in AngularJs with ngTable, the table is having filter as well as sorting feature, the application is working fine but as well as filtering and sorting also working fine, but the problem is that i need to filter the designation column with comma separated like as shown below

scientist,doctor

right now it will filter based on a single value

JSFiddle

can anyone please tell me some solution for this

var app = angular.module('app', ['ngTable']);

app.controller('IndexCtrl', function ($scope, $filter, ngTableParams) {
     $scope.peoples = [{
        "id": 145,
            "desig": "doctor",
            "name": "Manu",
            "place": "ABCD",
            "group": "ime123"
    }, {
        "id": 148,
            "desig": "engineer",
            "name": "John",
            "place": "POLK",
            "group": "ime148"
    }, {
        "id": 150,
            "desig": "scientist",
            "name": "Mary",
            "place": "USE",
            "group": "ime148"
    }];
    $scope.peoplesCopy = $scope.peoples;
    $scope.mytable = new ngTableParams({
        page: 1,            // show first page
        count: 10,          // count per page
        sorting: {
            name: 'desc'
        }
        
    }, {
        getData: function ($defer, params) {
           $scope.peoples = angular.copy($scope.peoplesCopy);
           var filteredData = $filter('filter')($scope.peoples, params.filter());
             $scope.peoples = $filter('orderBy')(filteredData, params.orderBy());
             $defer.resolve($scope.peoples);
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.js"></script>
<body ng-app="app">
<div ng-controller="IndexCtrl">
    <table border="1" ng-table="mytable" show-filter="true">
            <tr ng-repeat="people in $data">
                <td sortable="id" data-title="'Id'">{{people.id}}</td>
                <td sortable="desig" filter="{ 'desig': 'text' }" data-title="'Desig'">{{people.desig}}</td>
                <td sortable="name" data-title="'Name'">{{people.name}}</td>
                <td sortable="place" data-title="'Place'">{{people.place}}</td>
            </tr>
    </table>
</div>
</body>

Solution

According to angularjs documentation, beside string expression, we also can pass function for filter argument. You can achieve the requirement using custom filter function. The function have to filter list based on given comma separated string.

More or less change the your getData method with following. The updated jsfiddle is here: http://jsfiddle.net/ykktuo33/3/

getData: function ($defer, params) {
       $scope.peoples = angular.copy($scope.peoplesCopy);
       var filteredData = $filter('filter')($scope.peoples,
        // This is the custom filter function
        function(val,idx){
           // entered filter in column
           var filt = params.filter();
           if(filt && filt.desig) {
               var searchfilter = filt.desig;
               // split multiple filter comma separated
               var filterKeys = searchfilter.split(',');
               if(filterKeys) {
                   var ret = false;
                   // iterate multiple entered filter and return true for match
                   for(var key in filterKeys) {
                       var listVal = val.desig;
                       // call trim to remove whitespace between search filter keys
                       ret = (listVal.indexOf(filterKeys[key].trim())) > -1 || ret;
                   }
                   return ret;
               }  
           }
           return true;

  });
         $scope.peoples = $filter('orderBy')(filteredData, params.orderBy());
         $defer.resolve($scope.peoples);
    }