Question

有些朋友和我正在做一个项目。这是我与AngularJS合作的第二个项目，目前正在使用1.2.3版本。

尽管我有时发现它的一些行为很奇怪，并且不明白为什么会发生什么。

所以情况就是这样......我的cshtml文件中有以下内容：

<div class="checkbox">
    <label>
         <input name="somecheckbox" type="checkbox" ng-click="click()" ng-model="displayRegardlessOfSomething" />
         <label>Display regardless of something</label>
    </label>
</div>

<h1>{{displayRegardlessOfSomething}}</h1>

在我的javascript文件中，我在指令中有以下代码：

一开始：

$scope.displayRegardlessOfSomething = true;

我有以下内容：

$scope.click = function () {
    console.log($scope.displayRegardlessOfSomething)
}

每当我选中或取消选中复选框时，我总是得到 true ...但是，特殊部分是 <h1></h1> 标记内的内容发生了变化....所以，就像我在html图层上更改变量的值，但不是在JavaScript层上...

为什么会这样？

我已经通过使用$ parent.displayRegardlessOfSomething解决了这个问题，但我不明白为什么要解决这个问题...首先导致问题的是什么？

Answer 1

除非你非常确定所有东西都生活在相同的范围内，这几乎从来没有，你应该在你的ng-model表达式中总是有一个点。

myApp.controller('MyController2', function($scope) {

  $scope.model = { displayRegardlessOfSomething: true };

  $scope.click = function() {
    console.log($scope.model.displayRegardlessOfSomething);
  };
});

<input type="checkbox" 
       ng-click="click()" 
       ng-model="model.displayRegardlessOfSomething" />

有关现场演示的详情，请参阅this plunker。

Answer 2

我尝试了你在小提琴中所做的事情，它对我来说很好。

http://jsfiddle.net/nicolasmoise/X9KYU/1/

当你使用$parent时它适用于你的事实让我觉得父控制器在这里有问题。也许你有两个同名的变量？

P.S。：请记住，在Javascript中，基元通过值传递，对象通过引用传递。这是Angular开发人员犯下许多错误的原因。看到这个小提琴我说明了我的观点。

原语：http://jsfiddle.net/nicolasmoise/X9KYU/

包含对象：http://jsfiddle.net/nicolasmoise/X9KYU/2/

AngularJS复选框奇怪的行为

2 个答案: