在其他复选框ng-model的基础上更新复选框值的ng-model值

时间:2018-02-16 07:55:13

标签: javascript angularjs checkbox

我正在尝试根据其他复选框更新复选框。

这是我的第一个启用的复选框,用户可以更改其值;

<label>
  <input type="checkbox" id="chkAddVerification" name="chkAddVerification" 
  ng-model="chkAddVerification" ng-checked="chkAddVerification">
  Add Verification
</label>

这是根据第一个复选框值禁用和更新的第二个复选框;

<label>
   <input type="checkbox" id="chkSendCodeByEmail" name="chkSendCodeByEmail" 
   ng-model="chkSendCodeByEmail" ng-disabled="true" ng-checked="chkAddVerification">
   By Email
</label>

这就是我尝试将第一个复选框ng-model值绑定到第二个复选框ng-checked的方式:ng-checked="chkAddVerification"

显然它工作正常(根据第一个检查/取消选中第二个)但它不会更新第二个复选框的ng-model值。

如果我先检查复选框chkAddVerification,则第二个也会相应地进行检查,但ng-model chkSendCodeByEmail中包含false值。

我在这里缺少什么?

2 个答案:

答案 0 :(得分:2)

size_t count = sizeof array / sizeof *array; for(size_t i=0; i<count; ++i) { int *pElement = &array[i]; ng-model意味着不能一起使用。 您可以将ng-change用于相同的

ng-checked

工作示例http://jsfiddle.net/U3pVM/36066/

答案 1 :(得分:1)

// Code goes here

angular.module('demo', []);
angular.module('demo').controller('ModalDemoCtrl', function () {
 
});
 
<!doctype html>
<html ng-app="demo">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js"></script>
  </head>
  <body>

<div ng-controller="ModalDemoCtrl" class="modal-demo">
   <label>
  <input type="checkbox" id="chkAddVerification" name="chkAddVerification" 
  ng-model="chkAddVerification" ng-click="chkSendCodeByEmail=chkAddVerification">
  Add Verification,{{chkAddVerification}}
</label>
<label>
   <input type="checkbox" id="chkSendCodeByEmail" name="chkSendCodeByEmail" 
   ng-model="chkSendCodeByEmail" ng-disabled="true">
   By Email,{{chkSendCodeByEmail}}
</label>
</div>
  </body>
</html>

申请时, ng-click =“chkSendCodeByEmail = chkAddVerification”将更新其他模态值。

<label>
  <input type="checkbox" id="chkAddVerification" name="chkAddVerification" 
  ng-model="chkAddVerification" ng-click="chkSendCodeByEmail=chkAddVerification">
  Add Verification
</label>
<label>
   <input type="checkbox" id="chkSendCodeByEmail" name="chkSendCodeByEmail" 
   ng-model="chkSendCodeByEmail" ng-disabled="true">
   By Email
</label>