Question

我正在检查Angular Bootstrap UI，尤其是服务$modal并注意到一件有趣的事情。

在他们的示例中，“http://plnkr.co/edit/E5xYKPQwYtsLJUa6FxWt?p=preview”在控制器中附加到弹出窗口，他们将所选项目包含在另一个内部属性中

$scope.selected = {
   item: $scope.items[0]
};

而不是只有

$scope.selected = $scope.items[0];

实际上他们的代码按预期工作，而我的版本没有。

为什么需要这个？这里有什么JavaScript？

THX

Answer 1

他们正在嵌套属性，因为他们想在模态中执行此操作：

<li ng-repeat="item in items">
    <a ng-click="selected.item = item">{{ item }}</a>
</li>

ng-repeat为每个<li>创建子范围（模式也创建子范围）;如果您有$scope.selected = $scope.items[0];，则从ng-click设置selected会在子范围中设置该属性，但不会在父范围内设置该属性（在该示例中是您想要的）。另请参阅我的回答here。在

的情况下

$scope.selected = {
    item: $scope.items[0]
};

更改将影响父作用域的selected对象。

Answer 2

之前我误会了所以我决定四处搜寻：）

似乎问题在于原语和范围继承。在Objects中存储属性可确保它们不会在ngRepeat等指令中被覆盖。

此处有更多信息：https://github.com/angular/angular.js/wiki/Understanding-Scopes

另外值得注意的是，在执行ng-click =“selectedItem = item”时，ng-click =“selectItem（item）”将无法使用容器对象。

为什么需要额外的物体？

2 个答案: