使用 array.push() 时，Ng-repeat 似乎没有为每个项目创建单独的范围

Question

我有以下Angular视图：

<div ng-repeat="item in items track by $index">
    <input ng-model="item.name"/>
</div>

在控制器中，我调用了一项服务来获取新空项的 Json 表示，因此我可以使用以下函数将其添加到数组中：

$http.post("/NewItemJson").then(function (response) {
    $scope.newItem = response.data;
});

$scope.addItem = function() {
    $scope.items.push($scope.newItem);
};

但是当我测试视图时，我发现通过 addItem() 函数添加的所有新项目都绑定到同一范围。我可以这么说，因为如果我更改其中一个输入，所有其他输入都会同时更改：

这很奇怪，因为 ng-repeat 应该为每个项目创建不同的范围。实际上，对于未使用 addItem() 函数添加的数组的所有项目......但在这种情况下不是。我错过了什么？

Answer 1

您在执行 addItem() 时不会刷新 $scope.newItem，因此您会一遍又一遍地添加相同的项目。试试这个：

$scope.addItem = function() {
    $scope.items.push(angular.copy($scope.newItem));
};

使用 array.push() 时，Ng-repeat 似乎没有为每个项目创建单独的范围

Ng-repeat does not seem to create a separate Scope for each item when using array.push()

javascript

angularjs

ng-repeat