如何在角度js中为ng-disabled设置多个值?
我的问题用以下JS小提琴解释: http://jsfiddle.net/FJf4v/10/
<div ng-app>
<div ng-controller="myCnt">
<h3>A ->> <input type="checkbox" ng-model="check"> </input></h3>
<h3>B ->> <input type="checkbox" ng-model="check"> </input></h3>
<br/>
<input type="checkbox" ng-disabled="check">Chkbox1 to be disabled</input>
<input type="checkbox" ng-disabled="check">Chkbox2 to be disabled</input>
<hr/>
</div>
</div>
Javascript:
function myCnt($scope) {
//
}
在这个小提琴中,共有4个复选框,分别标记为A,B,Chkbox1和Chkbox2。 我正在寻找的是在选中A和B复选框之一后禁用chkbox1和chkbox2。然而,它完成了一半。如果单击A或B,则会检查这两个按钮,并且下面的chkbox会被禁用。但是,如果我只是点击它们中的任何一个,我不想检查A和B复选框。
我希望,你会得到我的问题。
谢谢!!
答案 0 :(得分:16)
使用两个单独的变量,即checkA和checkA。然后对于ng-disabled,使用逻辑OR运算符,如下所示:
ng-disabled="checkA || checkB"
我认为这是你想要实现的目标......?
答案 1 :(得分:6)
所以,正如我在评论中所说,如果你想通过一个很长的复选框来实现这个目的,你可以尝试这样:(对于这个例子,“非常长”意味着10)
模特
你可以使用一个简单的对象,它将包含复选框的所有值,我使用ng-repeat做了这个,但它可以是任何东西,只需使用相同的可迭代对象:
<input type="checkbox" ng-repeat="nb in [1,2,3,4,5,6,7,8,9,10]" ng-model="checkModels[nb]" /></h3>
此对象在控制器中初始化,我没有指定任何值,但您可以在此处设置一些复选框:
$scope.checkModels={};
禁用功能
这里没什么难的,而不是一长串的||值,我们将遍历模型并在找到复选框后立即返回true:
$scope.isThisDisabled=function(){
for(var i in $scope.checkModels)
{
if($scope.checkModels[i])
return true
}
return false;
}
然后,我们可以在HTML中使用此功能:
<input type="checkbox" ng-disabled="isThisDisabled()">Chkbox1 to be disabled</input>
经过修改的小提琴来测试这个:http://jsfiddle.net/DotDotDot/FJf4v/12/
玩得开心