根據其他復選框ng-model更新復選框值的ng-model值
[英]Update ng-model value of checkbox value on the basis of other checkbox ng-model
問題描述
我正在嘗試根據其他復選框更新一個復選框。
這是我啟用的第一個復選框，用戶可以更改其值。
<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值為錯誤。
我在這里缺少什么？
2 個解決方案
解決方案1
2 已采納 2018-02-16 08:13:06
ng-model和ng-checked不能一起使用。 您可以將ng-change用於相同的
<label>
<input type="checkbox" id="chkAddVerification" name="chkAddVerification"
ng-model="chkAddVerification" ng-change="chkSendCodeByEmail = chkAddVerification">
Add Verification
</label>
<label>
<input type="checkbox" id="chkSendCodeByEmail" name="chkSendCodeByEmail"
ng-model="chkSendCodeByEmail" ng-disabled="true">
By Email
</label>
解決方案2
1 2018-02-16 10:21:38
// 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>
具有ng-true-value的動態ng-model的帶有引導程序輸入復選框的Angular ng-repeat
[英]Angular ng-repeat with bootstrap input checkbox with dynamic ng-model using ng-true-value
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.