Question

我一直在学习角度，并在尝试访问父控制器时发现了这一点 http://jsfiddle.net/eqb23s8t/

我希望使用$ parent从ng-repeat内部的父控制器访问相同的变量，因此当按下其中一个复选框时，所有都应该更新，但事实并非如此。为什么？。

 <div ng-app ng-controller="ParentCtrl">
           <ul>
               <li ng-repeat="city in cities">{{city}}<input type="checkbox" ng-checked="$parent.somevar" /></li>
            </ul>
        </div>

Answer 1

首先，你的jsFiddle定义了一个ChildCtrl但它没有效果，因为你从不使用它。你可以删除它。

其次，如ngChecked文档中所述，ngChecked和ngModel之间存在差异： https://docs.angularjs.org/api/ng/directive/ngChecked

如果您期望发生的事情是同时选中/取消选中所有复选框，您可能需要ngModel而不是ngChecked。

从您的问题中不清楚您实际上要做什么，但这里是您的jsFiddle的一个分支，用于说明通过$ parent变量进行数据共享：

http://jsfiddle.net/7jzyk7f6/

它只是执行以下操作：

<li ng-repeat="city in cities">{{city}}<input type="checkbox" ng-model="$parent.somevar" /></li>

说明这两个概念。

Answer 2

您没有为视图绑定模型，这可以反映更改。当前代码只读取模型（在本例中为somevar）状态。使用ng-model代替ng-checked。角度将处理其余部分：

<强> HTML

<div ng-app ng-controller="ParentCtrl">
       <ul>
           <li ng-repeat="city in cities">{{city}}<input type="checkbox" ng-model="$parent.somevar" /></li>
        </ul>
    </div>

<强> JS

function ParentCtrl($scope) {
    $scope.cities = ["NY", "Amsterdam", "Barcelona"];
    $scope.somevar = true;
}

http://jsfiddle.net/eqb23s8t/4/

Answer 3

在这种情况下，您需要使用ngModel（双向绑定）而不是ngChecked（单向绑定）：

ng-model="$parent.somevar"

See JSFiddle

Answer 4

我也是Angular的新手，所以我错了。但是我在代码中看到的东西很少......首先，根本不使用ChildCtrl。其次，看起来只有ng-model指令应用了双向绑定到复选框。但ng-checked仅用于添加| checked 属性。

js-fiddle

Answer 5

先生，请使用ng-model来指代父母的范围。这是我为你创建的演示[demo] [1]

[1]: http://jsfiddle.net/nwg7bwLx/

从ng-repeat访问父控制器

5 个答案: