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>

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

Answer 2

首先：错误是自我说明。筛选器期望对象检查传递给筛选器的项目。您无法在对象属性名称中使用[]。

关于您的问题：因此，您希望显示属于特定组的所有用户。也许你自己的过滤器？

yourApp.filter("UserByGroupNameFilter", function ()
{                
    return function (arrUsers, groupName)
    {
        var resultUsers = [];
        for(var i in arrUsers){
          var user = arrUsers[i];                
            /* Loop for all columns
               for(var j in user.groups){
                 if(user.groups[j].name == groupName){
                     resultUsers.push(user);
                     break;
                }
            } 
            */
          if(user.groups[0].name == groupName){
               resultUsers.push(user);
          }
        }     
        return resultUsers;
    };
});

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

2 个答案: