Angularjs - 禁用和取消选中复选框答案

【问题标题】：Angularjs - disabling AND unchecking a checked boxAngularjs - 禁用和取消选中复选框
【发布时间】：2013-11-26 18:42:19
【问题描述】：

我有一组复杂的复选框，这些复选框填充了来自多维数组的数据，并且需要与它们一起发生一些特定的事情......我提取了我需要的最小值，因此我将尝试解释

在这个小提琴中

http://jsfiddle.net/EVZUV/

第一个复选框被启用，第二个被禁用。当第一个复选框被选中时，第二个复选框被启用。我想要得到的是取消选中第二个框，如果它在第一个复选框未选中时再次被禁用。

这是我几乎可以使用的代码

<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

我刚刚开始使用 intong-js，有些想法对我来说很“哇……”，但它看起来不错，所以我现在坚持下去。

谢谢！！

【问题讨论】：

标签： javascript angularjs checkbox

【解决方案1】：

这里的简单解决方案：http://jsfiddle.net/7mKtF/2/

HTML：

<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>

JS：

var app = angular.module('myApp', []);

基本上，我已更新您的 ng-checked 语句以包含 disablelist 属性。使用布尔逻辑，如果disablelist 为假，第二个复选框将评估为假。

编辑：

另外值得注意的是，按照您当前的方式，您的 ng-click 绑定实际上并没有做任何事情。您可能希望使用ng-click 调用函数变量，使用参数括号。

【讨论】：

谢谢！一开始我对 ng-click 感到畏缩，感谢您的意见。如果我可能会问，从哪里开始最容易进入角度（因为我发现文档对我没有多大作用）
对我来说，老实说，我认为我使用了 Angular 主页 - Angular 的文档在某些方面相当粗糙，但我在主页上尝试了一些示例，这些示例让我可以继续前进。（我想这有助于我也在研究一个用 Angular 广泛编写的公司代码库，所以我在那里有很多很好的例子。）
我想摆弄示例会很累。非常感谢。
@Thanq 这相当于布尔值“false”，因为这就是它的评估结果。当 disableList 改变时，Angular 将评估绑定语句并将其读取为 (true && false)，其评估结果为 false，取消选中该复选框。

【解决方案2】：

您可以通过将模型分配给第二个复选框来实现，然后在单击第一个复选框时将其重置。

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

Check the result in this jsFiddle

【讨论】：

感谢您的意见。虽然在我更大的应用程序中没有完全做到这一点，但我也学到了一些新东西。