2014-10-06 93 views
-1

我试图根据另一个复选框值更改复选框值,但该更改在模型中似乎没有任何影响。角度复选框更新没有更新模型

这是问题的一个代码示例:

http://plnkr.co/edit/eFOn3cejwKU01LkKNC1s?p=preview

HTML文件

<!DOCTYPE html> 

    <html> 

     <head> 
     <script data-require="[email protected]*" data-semver="1.2.0-rc3-nonmin" src="http://code.angularjs.org/1.2.0-rc.3/angular.js"></script> 
     <link data-require="[email protected]*" data-semver="3.0.0" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" /> 

     <link rel="stylesheet" href="style.css" /> 
     <script src="script.js"></script> 
     </head> 

     <body ng-app="main" ng-controller="DemoCtrl"> 
     <pre> 
     A value: {{a}} 
     B value: {{b}} 
     </pre> 
      A <input type="checkbox" ng-model="a" /> 
      B <input type="checkbox" ng-model="b" 
      ng-disabled="a" 
      ng-checked="!a && b" 
      /> 

     </body> 

    </html> 

和一个空的控制器:

var app = angular.module('main', []) 
     .controller('DemoCtrl', function($scope) { 

     }); 

至于我读过,Dom更改不会更改模型,并且当我尝试调用$ apply时,摘要已经在运行,所以我有点失落。

我不想在第一个复选框上放置$ watch,因为我的示例已经非常复杂。

是否有任何替代解决方案不涉及在控制器中写入js代码以解决此问题?

+0

我并不完全清楚你正试图在这里做。您是否试图通过点击另一个复选框来更改一个复选框?根据我的理解,看起来你正在试图检查一个,如果其他没有检查?你能详细说明一下吗?你不应该需要手表。 – ajmajmajma 2014-10-06 15:13:33

+0

我想要做的是在检查a时将b模型设置为false。因此,完整的演示将是检查b,然后检查一个,b是禁用和未选中,b模型仍然为真 – biaggi 2014-10-06 15:43:39

+0

谢谢大家的意见,我真正的问题比这个更复杂,这只是一个简化对它进行诠释。我的最终解决方案将是$观看“a”元素,这是因为即使当b被取消选中时,只要一个dom修改,并且即使它被一个角度指令触发,它也不会是在摘要中处理,所以如果dom元素或模型更改没有事件,则摘要将不考虑该更改。 – biaggi 2014-10-07 06:53:48

回答

1

下面是一个plunker呈现的方式来设置模型为false b值为被点击并设置为true时,不修改控制器。

http://plnkr.co/edit/rL6tTp5NfBzroZ2zSOgO?p=preview

这里是我修改,以做到这一点 - 看到NG-变化

A <input type="checkbox" ng-model="a" ng-change="b=!a" />