我有n次选择使用ng-repeat生成,当我更改其中一个选项时,我需要更新其他选项中的所有选项。我需要创建一个投票机制。例如:
Init:
- select 1: 1,2,3,4
- select 2: 1,2,3,4
- select 3: 1,2,3,4
- select 4: 1,2,3,4
After change select 1:
- select 1: 2 (selected)
- select 2: 1,3,4
- select 3: 1,3,4
- select 4: 1,3,4
After change select 2:
- select 1: 2 (selected)
- select 2: 4
- select 3: 1,3
- select 4: 1,3
...etc
选择的数量是动态的,选项总是显示生成的选择的数量
到目前为止我的代码:
<div ng-model="items">
<div ng-repeat="item in items">
<select ng-model="selectedPollNum" ng-change="changedPoll(selectedPollNum)">
<option ng-repeat="option in items">{{ $index + 1 }}</option>
</select>
<label>{{item.name}}</label>
</div>
</div>
jsFiddle:https://jsfiddle.net/gvwpgtj6/2/
此外,选项以空开头,我想从第一个开始
答案 0 :(得分:2)
我认为这将是您的要求。如果在select
中默认选择一个选项,则很难隐藏其他下拉列表中的默认选定选项。所以建议留空。
<强>控制器:强>
function LoginController($scope) {
$scope.arr = [];
$scope.obj={};
$scope.items = [{
name: 'Lorem ipsum dolor sit amet'
}, {
name: 'Consectetur adipiscing elit'
}, {
name: 'Fusce faucibus turpis eget'
}, {
name: 'Sed quis nisl sed ligula'
}, {
name: 'Nunc ultricies ipsum vitae'
}];
$scope.changedPoll = function(num, i) {
$scope.obj[i] = num;$scope.arr=[]
angular.forEach($scope.obj, function(value,key){
$scope.arr.push(parseInt($scope.obj[key]))
});
}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="LoginController">
<div ng-model="items">
<div ng-repeat="item in items">
<select ng-model="selectedPollNum" ng-change="changedPoll(selectedPollNum, $index)">
<option ng-repeat="option in items" ng-show='arr.indexOf($index + 1)<0'>{{ $index + 1}}</option>
</select>
<label>{{item.name}}</label>
</div>
</div>
</div>