如何在 angular js 中为 ng-disabled 设置多个值? [英] How can I put multiple values for ng-disabled in angular js?

查看:35
本文介绍了如何在 angular js 中为 ng-disabled 设置多个值?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在 angular js 中为 ng-disabled 设置多个值?

我的问题用以下 JS 小提琴来解释:http://jsfiddle.net/FJf4v/10/

 

<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</input><input type="checkbox" ng-disabled="check">Chkbox2被禁用</input><小时/>

Javascript:函数 myCnt($scope) {//}

在这个小提琴中,共有 4 个复选框标记为 A、B、Chkbox1 和 Chkbox2.我正在寻找的是在选中 A 和 B 复选框之一后禁用 chkbox1 和 chkbox2.然而,它完成了一半.如果您单击 A 或 B,这两个按钮都会被选中,并且下面的 chkbox 会被禁用.但是,如果我只是点击其中任何一个,我不想同时选中 A 和 B 复选框.

我希望,你会明白我的问题.

谢谢!!

解决方案

所以,正如我在评论中所说,如果你想用很长的复选框列表来实现这一点,你可以尝试这种方式:(是的例如很长"的意思是 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){如果($scope.checkModels[i])返回真}返回假;}

然后,我们可以在 HTML 中使用这个函数:

 Chkbox1 被禁用

修改后的小提琴来测试这个:http://jsfiddle.net/DotDotDot/FJf4v/12/

玩得开心

How can I put multiple values for ng-disabled in angular js?

My problem is explained with this following JS fiddle: 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) {
//
}

In this fiddle, there are total 4 check boxes labeled as A, B, Chkbox1 and Chkbox2. What I am looking for is to disable both chkbox1 and chkbox2 after checking one of A and B checkboxes. However, its done halfway. If you click on either A or B, both these buttons are getting checked and below chkboxes are getting disabled. But, I dont want to get checked both A and B checkboxes if I just click on any one of them.

I hope, you will get my question.

Thank you !!

解决方案

So, as I said in the comments, if you want to achieve this with a very long list of checkboxes, you can try this way : (yeah for this example "very long" means 10)

The models
You can use a simple object which will contain all the values of the checkboxes, I did this using a ng-repeat, but it could be anything, just use the same iterable object :

<input type="checkbox" ng-repeat="nb in [1,2,3,4,5,6,7,8,9,10]" ng-model="checkModels[nb]" /></h3>

This object is initialized in the controller, I didn't specify any value, but you could for example set some checkboxes here :

$scope.checkModels={};

The disabling function
Nothing very difficult here, instead of a long list of || values, we will iterate through the models and return true as soon as we find a checked box :

    $scope.isThisDisabled=function(){
     for(var i in $scope.checkModels)
     {
         if($scope.checkModels[i])
             return true             
     }
    return false;
}

Then, we can use this function in the HTML :

<input type="checkbox" ng-disabled="isThisDisabled()">Chkbox1 to be disabled</input>

The modified fiddle to test this : http://jsfiddle.net/DotDotDot/FJf4v/12/

Have fun

这篇关于如何在 angular js 中为 ng-disabled 设置多个值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆