ng-options 中的 Angularjs 'in' 过滤器答案

【问题标题】：Angularjs 'in' filter in ng-optionsng-options 中的 Angularjs 'in' 过滤器
【发布时间】：2016-01-11 03:21:52
【问题描述】：

我的选择框在 ng-repeat as，

<tr ng-repeat="project in projects | filter:filter">
    <td>
        <select class="form-control" ng-model="project.roleIds" ng-options= "role.id as role.name for role in roleList " multiple></select>
    </td>
<td>
    <select class="form-control" ng-model="project.company" ng-options= "obj.id as obj.name for obj in compnayList | filter:{roleId:project.roleIds}"></select>
    </td>
</tr>

我的 roleId 选择是多个，所以我想在选择角色时过滤公司列表下拉列表。因此，如果我选择两个角色，那么拥有该角色的公司将出现在下拉列表中。现在，如果我只选择一个角色，那么它会被它过滤，但不会被多个角色过滤。我可以通过 angular filter 在 ng-options 中这样做吗？自定义过滤器会起作用吗？

$scope.companyList=[{
    id:1,
    name:"ABC",
    roleId:1
},
{
    id:2,
    name:"ABCd",
    roleId:2
},
{
    id:3,
    name:"ABCgh",
    roleId:1
}];


$scope.roleList=[{
    id:1,
    name:"Grade A",
},
{
    id:2,
    name:"Grade B",
},
{
    id:3,
    name:"Grade C",
}];

而项目列表是这样的，

$scope.projects=[{
    id:100,
    projectName:"Project 1", 
    roleIds: [1,2],
    company:1
},
....
];

【问题讨论】：

你能显示角色列表数组吗？或者您可以为相同创建 plunker
我已经添加了roleList和projects数组

标签： javascript angularjs

【解决方案1】：

在这里查看如何使用过滤器http://dojo.telerik.com/EmoQu

 <input type='text' ng-model='roleId' placeholder='role id'>
 <select class="form-control" ng-model="project.available" ng-options= 'obj.id as obj.name for obj in [{id:1,name:"ABC",roleId:1},     {id:2,name:"ABCd",roleId:2},{id:3,name:"ABCgh",roleId:1}] | filter:roleId'

考虑到您的项目数组在那里。

【讨论】：

【解决方案2】：

使用comparator:

$scope.in = function (items, value) {
    return items.indexOf(value) !== -1;
};

在html中：

<select class="form-control" ng-model="project.available"
ng-options="obj.id as obj.name for obj in compnayList | filter:{roleId:project.roleIds}:in">
</select>

【讨论】：