angularjs如何通过多个删除重复选择 [英] angularjs how to remove duplicates by multiple select

问题描述

一个问题的角度JS。比方说，我有对象的数组例如：

a question to angular js. Let's say I have an array of objects eg:

items = [
{"id":1,"name":"AAA"},
{"id":2,"name":"BBB"},
{"id":3,"name":"CCC"},
{"id":4,"name":"DDD"}
]

现在我有我的看法2或3选择。

Now I have 2 or 3 selects in my view.

<select type="text" class="form-control form-control-small" 
ng-model="itemId" ng-options="item.id as item.name for item in items">
</select>

<select type="text" class="form-control form-control-small" 
ng-model="itemId" ng-options="item.id as item.name for item in items">
</select>

<select type="text" class="form-control form-control-small" 
ng-model="itemId" ng-options="item.id as item.name for item in items">
</select>

所以，我怎么能保证我在第二个（选定的所有负），两人在第三个（也选择了所有负）等第一选择，3个选项全部4个选项。
我怎么可以更新后续的选择每当有任何选择的变化。


提前很多感谢的想法。

So how can I assure that I have all 4 options in the first select, 3 options in the second one (all minus selected), two in the third one (also all minus selected) and so on. And how can I update the subsequent selects whenever there is a change in any of the selects.
Many thanks in advance for ideas.

推荐答案

您需要创建一个过滤器。结果
的注：我使用的是ES5过滤功能，它不会对IE8的工作，除非你使用垫片的

You need to create a filter.
Note: I am using the ES5 filter function, it won't work on IE8 unless your use a shim

yourModule.filter('exclude', function () {
    return function (items, exclude) {
        return items.filter(function (item) {
            return exclude.indexOf(item.id) === -1;
        });
    });
});

而在你的标记

<select type="text" class="form-control form-control-small" 
ng-model="itemId1" ng-options="item.id as item.name for item in items">
</select>

<select type="text" class="form-control form-control-small" 
ng-model="itemId2" ng-options="item.id as item.name for item in items | exclude:[itemId1]">
</select>

<select type="text" class="form-control form-control-small" 
ng-model="itemId3" ng-options="item.id as item.name for item in items | exclude:[itemId1, itemId2]">
</select>

如果您想更新你的选择，如果有在第一或第二个中的变化，使用 ngChange 指令重置或更改其他型号的值。

If you want to update your selects if there is a change in the first or second one, use ngChange directive for resetting or changing other model values.

这篇关于angularjs如何通过多个删除重复选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！