我在一个表中有一行，其中包含一个下拉列表和2个输入框。用户可以添加和删除多行。在下拉列表中的一行中选择的状态不能在其他行中选择。例如，如果在第一行中选择了德里，并且用户添加了其他一些行，则应在所有行中禁用德里。请让我知道如何实现它。我已经尝试了多个解决方案，这些解决方案都有相互依赖的下拉菜单，但在这里我要添加行。这是我的代码的Plunker链接：
http://plnkr.co/edit/o2NQFKitWB2ngdagr6zI?p=preview
HTML：
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse1">
<h4 class="panel-title">Country
</h4>
</a>
</div>
<div id="collapse1" class="panel-collapse collapse in">
<div class="panel-body">
<div class="rettbl-format">
<div class="table-responsive">
<table class="table tbl inv exp table-bordered">
<thead>
<tr>
<th>
<input type="checkbox" class="chkbx" name="main" data-ng-model="selectedAll" data-ng-click="selectAllInterSups()"/>
<label for="main"></label>
</th>
<th class="text-center">State</th>
<th class="text-center">Total Value</th>
<th class="text-center">Actual Value</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="objUnreg in interStateSup.unreg_details">
<th>
<input type="checkbox" class="chkbx" name="objUnreg_{{$index}}" data-ng-model="objUnreg.selected"/>
<label for="objUnreg_{{$index}}"></label>
</th>
<td>
<select name="stcode" class="form-control" data-ng-model="objUnreg.pos" data-ng-options="item.c as item.c+' - '+item.n for item in unregBlkStates" data-ng-required="objUnreg.txval>0 || objUnreg.iamt>0">
<option value="">Select</option>
</select>
<span ng-show="myForm.stcode.$error.required"></span>
</td>
<td>
<input class="form-control formedit newinv currency" data-ng-model="objUnreg.txval"/>
</td>
<td>
<input class="form-control formedit newinv currency" data-ng-model="objUnreg.iamt" />
</td>
</tr>
</tbody>
</table>
<div class="row pull-right">
<button type="button" class="btn btn-primary" data-ng-click="addNewUnRegSups()">ADD</button>
<button type="button" class="btn btn-danger" data-ng-click="removeSelectedUnRegSups()">REMOVE</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
JS：
$scope.unregBlkStates = [{
"c": "35",
"n": "Andaman and Nicobar Islands",
"u": "Y"
}, {
"c": "37",
"n": "Andhra Pradesh",
"u": "N"
}, {
"c": "12",
"n": "Arunachal Pradesh",
"u": "N"
}, {
"c": "18",
"n": "Assam",
"u": "N"
}, {
"c": "10",
"n": "Bihar",
"u": "N"
}, {
"c": "04",
"n": "Chandigarh",
"u": "Y"
}, {
"c": "22",
"n": "Chhattisgarh",
"u": "N"
}, {
"c": "26",
"n": "Dadra and Nagar Haveli",
"u": "Y"
}, {
"c": "25",
"n": "Daman and Diu",
"u": "Y"
}, {
"c": "07",
"n": "Delhi",
"u": "N"
}, {
"c": "30",
"n": "Goa",
"u": "N"
}, {
"c": "24",
"n": "Gujarat",
"u": "N"
}, {
"c": "06",
"n": "Haryana",
"u": "N"
}, {
"c": "02",
"n": "Himachal Pradesh",
"u": "N"
}, {
"c": "01",
"n": "Jammu and Kashmir",
"u": "N"
}, {
"c": "20",
"n": "Jharkhand",
"u": "N"
}, {
"c": "29",
"n": "Karnataka",
"u": "N"
}, {
"c": "32",
"n": "Kerala",
"u": "N"
}, {
"c": "31",
"n": "Lakshadweep",
"u": "Y"
}, {
"c": "23",
"n": "Madhya Pradesh",
"u": "N"
}, {
"c": "27",
"n": "Maharashtra",
"u": "N"
}, {
"c": "14",
"n": "Manipur",
"u": "N"
}, {
"c": "17",
"n": "Meghalaya",
"u": "N"
}, {
"c": "15",
"n": "Mizoram",
"u": "N"
}, {
"c": "13",
"n": "Nagaland",
"u": "N"
}, {
"c": "21",
"n": "Odisha",
"u": "N"
}, {
"c": "34",
"n": "Puducherry",
"u": "N"
}, {
"c": "03",
"n": "Punjab",
"u": "N"
}, {
"c": "08",
"n": "Rajasthan",
"u": "N"
}, {
"c": "11",
"n": "Sikkim",
"u": "N"
}, {
"c": "33",
"n": "Tamil Nadu",
"u": "N"
}, {
"c": "36",
"n": "Telangana",
"u": "N"
}, {
"c": "16",
"n": "Tripura",
"u": "N"
}, {
"c": "09",
"n": "Uttar Pradesh",
"u": "N"
}, {
"c": "05",
"n": "Uttarakhand",
"u": "N"
}, {
"c": "19",
"n": "West Bengal",
"u": "N"
}];
var emptyObj = {
'pos': 0,
'txval': 0.0,
'iamt': 0.0
};
$scope.interStateSup = {
'unreg_details': [angular.copy(emptyObj)],
};
$scope.goToPage = function (path) {
$location.path(path);
};
$scope.selectedAll = false;
$scope.selectAllInterSups = function () {
angular.forEach($scope.interStateSup.unreg_details, function (obj) {
obj.selected = $scope.selectedAll;
});
};
$scope.addNewUnRegSups = function () {
$scope.interStateSup.unreg_details.push(angular.copy(emptyObj));
};
$scope.removeSelectedUnRegSups = function () {
var newDataList = [];
$scope.selectedAll = false;
angular.forEach($scope.interStateSup.unreg_details, function (obj) {
if (obj.selected === undefined || (obj.selected !== undefined && !obj.selected)) {
newDataList.push(obj);
}
});
$scope.interStateSup.unreg_details = newDataList;
};
答案 0 :(得分：1)
很难说这是否是最佳解决方案，但它确实有效。 您需要创建一个过滤器（特定于您的数据）：
app.filter('exclude', function() {
return function(list,currentModel,selected){
var selectedLength = selected.length;
var out = [];
angular.forEach(list,function(listItem,index){
var add = true;
for (var index = 0; index < selectedLength; index++) {
if(selected[index].pos !== currentModel && selected[index].pos === listItem.c){
add = false;
break;
}
}
if(add){
out.push(listItem);
}
});
return out;
}
});
HTML：
<select name="stcode" class="form-control" data-ng-model="objUnreg.pos" data-ng-options="item.c as item.c+' - '+item.n for item in unregBlkStates|exclude:objUnreg.pos:interStateSup.unreg_details" data-ng-required="objUnreg.txval>0 || objUnreg.iamt>0">
<option value="">Select</option>
</select>