AngularJS ng-repeat过滤特定的嵌套属性

Question

我试图通过特定的数组属性过滤ngRepeat.

JS:

app.controller('UserIndexController', function ($scope, $http, $window) {

    $scope.search = {};

    $http({ method: 'GET', url: '/api/v2/group' })
        .success(function(data, status, headers, config) {

            $scope.groups = data;

        })
        .error(function(data, status, headers, config) {

        });

    $http({ method: 'GET', url: '/api/v2/user' })
        .success(function(data, status, headers, config) {

            $scope.users = data;

        })
        .error(function(data, status, headers, config) {

        });
});

HTML:

<div data-ng-controller="UserIndexController">
<select 
    ng-model="search.group" 
    ng-options="group.name as group.name for group in groups" 
    class="form-control">
    <option value="">Filter Users by Group</option>
</select>

<table class="table table-responsive table-striped table-hover">
        <thead>
    <tr>
            <th>User Type</th>
            <th>Email</th>
        <th>Name</th>
            </tr>
        </thead>
        <tbody>
        <tr data-ng-repeat="user in users | filter:search.group">
        <td><% user.groups[0].name %></td>
        <td><% user.last_name %>, <% user.first_name %></td>
        <td><% user.email %></td>
    </tr>
    </tbody>
    </table>
</div>

上面的代码搜索整个用户对象.不希望出现此行为,因为如果任何其他user数据属性与所选选项中的字符串匹配,则此行也将包含在筛选器中.

如何确保过滤器仅适用于user.groups[0].name列？

<tr data-ng-repeat="user in users | filter:{user.groups[0].name: search.group}">导致以下错误:Syntax Error: Token '[' is unexpected.

因此,我需要user.groups[0].name直接放入用户对象,以便过滤器不必通过数组访问它,或者对数组对象进行过滤.

Answer 1

您可以使用自定义过滤器功能:

$scope.groupMatcher = function(groupFilter) {
  return function(user) {
    return user.groups[0].name === groupFilter;
  }
};

并使用它:

<ul>
  <li ng-repeat="user in users | filter:groupMatcher('2')">
    {{user.name}}
  </li>
</ul>

如果需要,可以更频繁地将其定义为模块中的自定义过滤器