How do you filter based on css class in Angular.js?

Question

I'm trying to filter my results based on a css class and can't seem to think of the easiest/best way to do that.

Essentially by clicking on a link, I would like my filtered results to only show items where the "in_red" class is used.

user2847643 · Accepted Answer · 2014-02-08 18:43:24Z

2

Instead of filtering by class, filter by the actual property of the object. After all the class is set based on the name property.

One solution would be to use a custom filter function:

ng-repeat="friend in friends | filter:filterFriends"

Where filterFriends would be something like:

function(friend) {
  if ($scope.filterOnRed === true) {
    return friend.name.substring(0,1) == 'J';
  } else {
    return friend.name.indexOf($scope.searchText) != -1;
  }
}

answered Feb 8, 2014 at 18:43

user2847643

2,93517 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Arthur Frankel Over a year ago

Thank you - that's what I needed. I needed some more work on this because I was going after the index as well and since I can't get the index inside of the function (at least I couldn't figure that out) I had to add an index element to my "friend" object and then I was able to reference it. Thanks again.

Collectives™ on Stack Overflow

How do you filter based on css class in Angular.js?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related