takeradi
takeradi

Reputation: 3871

AngularJS filter based on the column displayed

Please refer to this Plunk: http://plnkr.co/edit/5YCCdDSnpHKRU51R9vCL?p=preview

How do I filter based on the field that is displayed? Currently, the filtering is done on the complete user object.

For eg:

$scope.users1 = [
  {name: 'Dave', id: 24},
  {name: 'Tim', id: 22},
  {name: 'Laura', id: 20}
];

<user-info-card users="users" label="name">
</user-info-card>

If I display only the id, the filter works even if I type "Dave". I want it to work only on the fields displayed. Also want it to be generic. It could be a different object but the search term should look at the label field and filter accordingly

Upvotes: 0

Views: 49

Answers (2)

codeninja.sj
codeninja.sj

Reputation: 4129

You can use strict filter to do this stuff.

test.html

<div>
 <input placeholder="Search for a name..." ng-model="searchTerm" ng-change="onChange()">
  <div ng-repeat="user in users | filter:user:strict">
    ...
  </div>
</div>

During text box key change event, search term is converted as object field value.

script.js

$scope.onChange = function () {
      var user = {};
      user[$scope.label] = $scope.searchTerm;
      $scope.user = user;
     };

Check this link

Upvotes: 0

Fraction
Fraction

Reputation: 463

Added a function which will sort based on label, hope if suffice.

http://plnkr.co/edit/iCepagIKA1OFDjBnB35I?p=preview

$scope.searchTerm = function(item) {        
  if(item[$scope.label].toString().
    startsWith($scope.searchCondition1)){
          return true;
        }
        else{
          return false;
        }
}

Upvotes: 1

Related Questions