Select AngularJS过滤多个选择输入

我真的很惊讶，在任何地方都没有关于AngularJS更高级过滤机制的文档或问题，这对于任何UI都是必不可少的

我需要过滤掉包含当前项目的选择选项。问题是，当我们迭代到过滤器中的项目时，如何拼接每个选项，并为要过滤的列表中的每个选择返回正确的结果

例如，如果我们有三个地区-加拿大、英国、美国-选择输入应如下所示：

Canada
  [select]
    [option0] United Kingdom
    [option1] United States

United Kingdom
  [select]
    [option0] Canada
    [option1] United States

United States
  [select]
    [option0] Canada    
    [option1] United Kingdom 

。。等等

HTML:

{{region.name}
使用与以下相同的关键字：
{{region.name}

Javascript:

app.filter('myFilter', function() {

    return function(items) {
        var group = [];

        for (var i = 0; i < items.length; i++) {
            group.push(items.name);
        }

        for (var i = 0; i < group.length; i++) {
           group[i].splice(i, 1);
        }

        return group;

    };

});

app.filter（'myFilter'，function（）{
返回函数（项目）{
var组=[]；
对于（变量i=0；i

使选择不包括当前所选内容时存在缺陷。我将在解决方案中包含该错误，以便您可以看到它

ng选项是您所需要的。下面是一个使用2个单独选择的示例

<select ng-model='selectedCountry' ng-options='country.name for country in countries'></select>
<select ng-model='selectedCountry' ng-options='country.name for country in filteredCountries()'></select>

您会注意到的错误是，一旦您选择第二个，它就不会显示您选择的值，因为它会立即从选项中过滤出来。这不是最好的用户体验

工作示例：

更新： 由于不能将ng选项与AngularUI Select2指令一起使用，因此这里有一个带有select 2的plunkr示例：

另外，与上面列出的filteredCountries功能不同，

监视将更有效。它只会在检测到监视值发生变化时运行代码

$scope.$watch('version1model',function(){
    $scope.filteredItems = [];
    angular.forEach($scope.items, function(val, key){
      if(val.id != $scope.version1model){
        this.push(val);
      }
    },$scope.filteredItems); 
  });

我想出了一个解决办法。这是一个基本筛选器，但实际上我将ng repeat中索引的当前值传递给筛选器：

过滤器：

app.filter('keywordFilter', function() {
    return function(items, name) {
        var arrayToReturn = [];
        for (var i = 0; i < items.length; i++) {
            if (items[i].name != name.name) {
                arrayToReturn.push(items[i]);
            }
        }
        return arrayToReturn;
    };
});

app.filter（'keywordFilter'，function（）{
返回函数（项目、名称）{
var arrayToReturn=[]；
对于（变量i=0；i

HTML


使用与以下相同的关键字：
谢谢您的回答！我真的不认为有一个可行的方法来实现这一点？至少不是没有对$filter服务的正确了解，问题是我使用的ui-select2不支持ng选项，fml！
$scope.$watch('version1model',function(){
    $scope.filteredItems = [];
    angular.forEach($scope.items, function(val, key){
      if(val.id != $scope.version1model){
        this.push(val);
      }
    },$scope.filteredItems); 
  });

app.filter('keywordFilter', function() {
    return function(items, name) {
        var arrayToReturn = [];
        for (var i = 0; i < items.length; i++) {
            if (items[i].name != name.name) {
                arrayToReturn.push(items[i]);
            }
        }
        return arrayToReturn;
    };
});

<select ui-select2 id="copy-{{$index}}" class="input-xlarge" ng-change="_copy($index)" ng-options="region.name for region in data.regions | keywordFilter: {name: region.name}" data-ng-model="selectedKeywords">
    <option value="">Use same keywords as:</option>
</select>