从一个 scope/ng-options 中删除（拼接）值，同时保留另一个中的值

Question

我有一个由一个范围填充的下拉列表，并使用另一个范围显示同一个列表。当我从下拉列表中 select 某些内容时，我想从显示列表中 hide/remove 它，但将完整列表保留在下拉列表中。

I have a JS fiddle started: https://jsfiddle.net/mfzbk8nv/6/

Fiddle: enter link description here

现在发生的事情是它删除了显示列表中的第一个字母，而不是我要删除的那个。其次，它从下拉列表和显示列表中删除。

感谢任何帮助！

我的HTML:

<div  ng-app="myApp" ng-controller="myController">
    <select ng-model="mySel" ng-options="i for i in list2" ng-change="removeIt(mySel)" ></select>

    <ul style="list-style:none;">
        <li ng-repeat="item in list1">
            {{item}}
        </li>
    </ul>
</div>

我的 JS：

var app = angular.module('myApp', [])
app.controller('myController', function ($scope) {
    $scope.data = {};
    var arr = ['a', 'b', 'c', 'd', 'e']
    $scope.list1 = arr;
    $scope.list2 = arr;

    $scope.removeIt = function(i){    
        $scope.list1.splice(i,1)        
    }    
})

Answer 1

ng-options 没有 $index，那只在 ng-repeat

之内

您必须创建自己的索引 ng-options 的方法，方法是对事物进行分组并创建自己的方法。

<select ng-model="mySel" 
    ng-options="index as mySel for (index, mySel) in list2"
    ng-change="removeIt(mySel)" />

现在 mySel 将是这个 index，它不是每次迭代都创建的。

jsFiddle Updated Demo here

Answer 2

list1 和 list2 都引用同一个数组 arr。所以当你改变其中一个时，你就改变了另一个。尝试复制它

var dup_array = original_array.slice

从一个 scope/ng-options 中删除（拼接）值，同时保留另一个中的值

Remove (splice) value from one scope/ng-options, while maintaining values in another

angularjs

ng-repeat

angularjs-scope