AngularJS ng-options按数组值过滤

时间:2019-03-06 04:28:57

标签: angularjs angularjs-filter

我需要一些帮助来弄清楚如何使用AngularJS过滤器仅显示符合我条件的选项。

我有下面的数组。

var users = [
  {'id':0, 'name':'John',  'roles':['Admin']},
  {'id':1, 'name':'Alice', 'roles':['Admin', 'Tech']},
  {'id':2, 'name':'Sam':   'roles':['Tech']}
]

我使用以下代码在<select>列表中呈现所有用户。但我只想向用户显示谁是“技术”角色。我在这里经历了其他一些答案,但是它们都将过滤器与对象一起使用,我正在尝试使用数组。

<select data-ng-options="item.id as item.name for item in users"></select>

我尝试仅在data-ng-if="item.roles.indexOf('Tech') > -1"标签上显示带有<select>的选项,但是该条件从未得到满足,因此完全不显示下拉菜单(这很有意义)。

我还尝试将data-ng-options="item.id as item.name for item in users | filter:{item.roles:'Tech'}"与过滤器配合使用,但是由于AngularJS解析错误而失败。

不确定如何按数组值进行过滤。

1 个答案:

答案 0 :(得分:2)

您上一次尝试的逻辑是正确的,但是语法错误很小。尝试以下

xor

您还可以为此创建自己的自定义过滤器功能

html

or

js

<select ng-model="selectedValue" data-ng-options="item.id as item.name for item in users | filter: { roles: ('Tech') }"></select>

Demo