Question

我有两个选择框（框1和框2），它们绑定到模型数组。如果在框1中选择了一个选项，则该项目不应显示在box2中，反之亦然。我怎样才能在Angularjs中做到这一点。

以下是我的HTML

<select class="form-control" name"box1" ng-model="data.box1" ng-options="sq.text for sq in array1.boxvalue | filter :data.box1" required><option value="">Choose 1</option></select>

<select class="form-control" name"box2" ng-model="data.box2" ng-options="sq.text for sq in array1.boxvalue | filter: data.box1"" required><option value="">Choose 2</option></select>

array1.boxvalue = {['id':1,'text':'test1'],['id':2,'text':'test2'],['id':3,'text':'test3']}

如何实现以下目标：当在box1中选择test1时，box2下拉列表不应显示test1，反之亦然。

由于

Answer 1

您正在思考，您需要一个过滤器，它将通过数组并排除您不喜欢的值。

（我正在编写代码，因此我不确定它是否100％有效。）

app.filter('excludeValue', function() {
    return function(input, val) {
        var newArray = [];
        //Loop through all the results and remove the one that is not needed
        for( var n = 0 ; n < input.length; n++) { 
            //Check if current value is not the same as a value we need to exclude
            if(input[n] != val) { 
                newArray.push(input[n]);
            }
        } 
        return newArray;
    };
});

编辑：这是一个有效的plunker

Answer 2

查看：

   <select    ng-model="data.box1" 
  ng-options="sq.text for sq in array1 | filter: notinbox2" required></select>

<select    ng-model="data.box2" ng-options="sq.text for sq in array1 |filter: notinbox1" required></select>

<强>控制器：

$scope.array1 =[{'id':1,'text':'test1'},{'id':2,'text':'test2'},{'id':3,'text':'test3'}]
        $scope.data={}
        $scope.notinbox2 = function(item){
            if(item == $scope.data.box2)
                {
                return false

                }
            else 
                return true

        }
        $scope.notinbox1 = function(item){
            if(item == $scope.data.box1)
                {
                return false

                }
            else 
                return true

        }

从您的问题中简化了一些事情

Plunker [http://plnkr.co/edit/NM7ovJ3wIpLohYIiDsu2?p=info]

如何使用Angularjs过滤器过滤一个绑定到两个选择框的数组

2 个答案: