Javascript Angularjs-禁用和取消选中复选框
我有一组复杂的复选框,里面装满了多维数组中的数据,有一些特定的事情需要处理。。。我提取了我所需要的最低限度,因此我将尝试解释 用这把小提琴 第一个复选框处于启用状态,第二个复选框处于禁用状态。选中第一个复选框后,第二个复选框将启用。我试图得到的是,如果第二个复选框在第一个复选框未选中时再次变为禁用,则取消选中第二个复选框 这是我的代码,几乎可以工作Javascript Angularjs-禁用和取消选中复选框,javascript,angularjs,checkbox,Javascript,Angularjs,Checkbox,我有一组复杂的复选框,里面装满了多维数组中的数据,有一些特定的事情需要处理。。。我提取了我所需要的最低限度,因此我将尝试解释 用这把小提琴 第一个复选框处于启用状态,第二个复选框处于禁用状态。选中第一个复选框后,第二个复选框将启用。我试图得到的是,如果第二个复选框在第一个复选框未选中时再次变为禁用,则取消选中第二个复选框 这是我的代码,几乎可以工作 <input type="checkbox" ng-model="disablelist" ng-click="checkitems">
<input type="checkbox" ng-model="disablelist" ng-click="checkitems">Check this box to enable the other.. <br><br>
<input type="checkbox" ng-disabled="!disablelist" ng-checked="checkitems">When this checkbox is disabled it also must get unchecked
选中此框以启用其他
禁用此复选框时,也必须取消选中它
我刚开始学习js,有些想法对我来说很“哇…”,但看起来不错,所以我现在坚持
谢谢 您可以将模型指定给第二个复选框,然后在单击第一个复选框时将其重置 HTML:
<input type="checkbox" ng-model="disablelist" ng-click="otherOption = false" /> Check this box to enable the other..
<input type="checkbox" ng-model="otherOption" ng-disabled="!disablelist" ng-checked="!!otherOption && !disableList" /> When this checkbox is disabled it also must get unckeched
选中此框以启用其他。。
禁用此复选框时,它也必须解除锁定
这里有一个简单的解决方案:
HTML:
基本上,我已经更新了您的ng checked
语句,以包含disablelist
属性。使用布尔逻辑,如果disablelist
为false,则第二个复选框将计算为false
编辑:
同样值得注意的是,按照您目前的方式,您的
ng点击
绑定实际上什么都不做。您可能希望使用ng单击调用函数变量,使用参数括号。谢谢!首先,我对ng的点击感到很沮丧,我感谢您的输入。如果我可能会问,从哪里开始学习angular(因为我发现文档对我没有多大帮助)对我来说,老实说,我认为我使用了angular主页-angular的文档在某些方面相当粗糙,但我在主页上玩了很多例子,这些例子让我走得足够远。(我想这也有帮助,因为我还在一个公司代码库上工作,这个代码库是用Angular编写的,所以我在那里有很多很好的例子。)我想这是为了摆弄例子。非常感谢。@Thanq它相当于布尔值“false”,因为这就是它的计算结果。当disableList更改时,Angular将计算binding语句并将其读取为(true&false)
,其计算结果为false,取消选中复选框。感谢您的输入。虽然在我更大的应用程序中没有完全做到这一点,但我也学到了一些新东西。
<div ng-app="myApp">
<input type="checkbox" ng-model="disablelist">Check this box to enable the other.. <br><br>
<input type="checkbox" ng-disabled="!disablelist" ng-checked="disablelist && 0">When this checkbox is disabled it also must get unchecked
</div>
var app = angular.module('myApp', []);