javascript - 从 ngRepeat 更新 $scope 变量

Question

我在 View 中有一个 ngRepeat 循环，对于每个项目，我都有一个连接到 $scope 变量的自定义切换控件，如下所示:

<a ng-repeat="item in items" ng-click="isOn = !isOn" ng-class="{on: isOn}">
   Toggle!
</a>

单击链接时，isOn 变量会按预期切换，但仅针对单击的项目。我希望所有项目都更新，因为 isOn 在 Controller 中定义为 $scope.isOn = false

当我使用 Controller 方法切换变量时，所有项目都会更新!

<a ng-repeat="item in items" ng-click="toggle()" ng-class="{on: isOn}">
   Toggle!
</a>

--- controller ---

$scope.toggle = function() {
    $scope.isOn = !$scope.isOn;
}

您能解释一下这种行为吗？是因为 ngRepeat 正在为每个项目创建一个单独的范围吗？

Answer 1

是的，ngRepeat 正在为每个项目创建一个单独的范围。参见 AngularJS ngRepeat

The ngRepeat directive instantiates a template once per item from a collection. Each template instance gets its own scope...

编辑: 来自@doodeec 评论

您可以改为切换父范围。ng-click="$parent.isOn = !$parent.isOn"