Angular JS Filter Group Select Filter

Question

I have a users object similar to the one below:

$scope.users = [
     { 
         name : 'John Doe',
         attached_groups = [
            {1:object},
            {2:object}
         ]
     },
     { 
         name : 'Bob Doe',
         attached_groups = [
            {3:object},
            {4:object}
         ]
     }
];

In my HTML I have the following group select.

<select id="group_filter">
     <option value="1">Group 1</option>
     <option value="2">Group 2</option>
     <option value="3">Group 3</option>
     <option value="4">Group 4</option>
</select>

I would like to add a filter to my ng-repeat to filer on the groups. I have the following ng-repeat.

<tr ng-repeat="user in users| filter:query>

Any help would be appreciated.

Answer 1

Well I didn´t change the structure of the $scope.users but you need review because i donñt think is the best way.

The important here:

http://codepen.io/luarmr/pen/YXVqqp

ng-repeat="user in users | filter:search"

and you need define the search filter:

$scope.search = function(user) {

    if ($scope.filter === undefined ) {
      return true;
    }

    var match = false;

    angular.forEach(user.attached_groups, function(group) {
      if (group.hasOwnProperty($scope.filter)) {
        match = true;
      }
    });

    return match;
 };

the filter could be more easy if you change the attached_groups. You can see the example here: https://docs.angularjs.org/api/ng/filter/filter

Answer 2

create an input of type text, and ng-model="query" .

<input type="text" ng-model="query">

this will then be filtered:

<tr ng-repeat="x in users | filter:query">...</tr>