AngularJS：在多个复选框被“选中”后启用按钮答案

【问题标题】：AngularJS: Enable Button after Multiple Checkboxes as been "checked"AngularJS：在多个复选框被“选中”后启用按钮
【发布时间】：2014-11-17 04:00:38
【问题描述】：

假设我有两个问题，每个问题都有各自的复选框和“下一步->”按钮。一旦每个问题至少有一个选中的复选框，我想启用“下一步”按钮。我把所有东西都包裹在一个表格上。像这样的

<form name="form_" novalidate>
 <div="cont_1" >
     <label>
      <input type="checkbox" ng-model="data1.enabled" ng-required="!data1.enabled">
     </label>
      .
      . 
  </div>
  <div="cont_2" >
     <label>
       <input type="checkbox" ng-model="data5.enabled" ng-required="!data5.enabled">
     </label>
       .
       .
  </div>
  <button ng-disabled="form_.$invalid">
  </form>

问题是我必须为要启用的按钮选择所有复选框，我不希望这样，我想要的是从每个问题中至少检查一个以启用按钮，它可以是 1 和 1 , 2 & 3 等等..但不是全部。我之前使用过带有单选按钮的 ng-required 并且它确实有效。但复选框不一样。似乎 $invalid 正在检查所有这些是否符合，但这不是我想要的。

提前致谢！！！

【问题讨论】：

标签： javascript angularjs validation checkbox

【解决方案1】：

您不应该将 ng-required 用于复选框，因为 required 用于复选框意味着它必须被选中才能有效。因此，如果您在表单中有一些复选框 required 则必须检查该表单是否有效。

单选按钮的工作方式不同。单选按钮上的required 强制选择至少一个值。

检查一下

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_checkbox_required

您应该为每个问题维护一个类似标志的东西，该标志可以在为该问题选择答案时设置，如果所有问题的这些标志都已设置，则启用该按钮。 ng-required 不是解决办法。

【讨论】：

【解决方案2】：

我同意 Nils 的观点 - 你希望从 ng-required 中得到一些不应该做的事情。

您需要：

在一些 QuestionService 中实现逻辑，确定有多少检查的答案构成一个已回答的问题，并推动您的查看该逻辑，或
创建一个指令来监视其子项中的复选框。

对于方法（1），我创建了一个 plunker：http://plnkr.co/edit/pON3PmS77oqqe0aj4Fsb

【讨论】：