如何禁用不同选择的选项以便始终选择不同的选项？

Question

我正在与 Angularjs 合作。

HTML:

<select name="questionId1" ng-model="abCtrl.form.questionSel.q1" ng-options="question.val for question in abCtrl.form.questions track by question.index"></select>

<select name="questionId2" ng-model="abCtrl.form.questionSel.q2" ng-options="question.val for question in abCtrl.form.questions track by question.index"></select>

我希望用户选择的选项对于其他选择将被禁用，反之亦然

Answer 1

两种方式：

查看堆栈 post：ng-options with disabled rows。很好的解决办法说明了
使用多选组件，举例：http://dotansimha.github.io/angularjs-dropdown-multiselect/#/

Answer 2

你能试一下吗angularngDisabled网上有很多可用的例子，你能浏览一下吗。另外，我在这里附上了一些示例代码，例如

对于ngDisabled

<!DOCTYPE html>
<html ng-app="sample">
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<script>
   angular.module('sample',[]).controller('sampleCntrl',function($rootScope){
   $rootScope.disableVal= true;
   });
</script>
<div ng-controller="sampleCntrl">
<p>
<button ng-disabled="disableVal">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch"/>Button
</p>
<p>
<button ng-disabled="disableVal">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch"/>Button
</p>
<p>
{{ mySwitch }}
</p>
</div> 
</body>
</html>

Answer 3

尝试使用不同的方法，像这样

<select name="questionId1" ng-model="abCtrl.form.questionSel.q1">
<option ng-repeat="question in abCtrl.form.questions" value="{{question.val}}" 
ng-disabled="abCtrl.secondSelectValue == question.val"
ng-selected="abCtrl.firstSelectValue == question.val">{{question.val}}
</option>
</select>

abCtrl.firstSelectValue 将是你的 select 框的默认值（否则第一次 selection 会是空的）

Answer 4

用 ng-repeat 选项替换 ng-options 可以同化为回归...

您可以在 ng-options:

中使用 ... disable when ... 语法

第一个ng-options:

...  disable when (question.index === questionSel.q2)  ...

第二个ng-options:

...  disable when (question.index === questionSel.q1)  ...

这是一个fiddle

如何禁用不同选择的选项以便始终选择不同的选项？

How can I disable options for different selects in order to have always different options selected?

angularjs

ng-options

angularjs-select