AngularJS，使用复选框更改模型值

Question

我有一个名为 'bool' 的绑定数据变量，它的值为 100。当我单击一个复选框时，我希望该值增加 50。我做错了什么？

<div ng-app="app">
  <h3 ng-model="bool = 100">BOOL</h3>
    <input type="checkbox" ng-model="add = 50"/>
    <div>{{bool + add}}</div>
</div>

如有任何帮助，我们将不胜感激，

谢谢:)

Answer 1

ng-model 不能是表达式。如果你需要分配一个默认值，你应该使用 ng-init.

此外，复选框的值为真 (1) 或假 (0)。因此，尽管 {{bool + add}} 最初会显示 150，但只要您选中或取消选中该复选框，它就会显示 100 或 101，因为现在 add 要么是 0或 1 取决于选中的状态。

angular.module('app', []);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <div ng-app="app">
      <h3 ng-model="bool" ng-init="bool = 100; additional = 0">BOOL</h3>
        <input type="checkbox" ng-model="add" ng-change="additional = add * 50"/>
        <div>{{bool + additional}}</div>
    </div>

AngularJS，使用复选框更改模型值

AngularJS, change model value with checkbox

html

javascript

directive

angularjs

angularjs-directive