AngularJS 从范围创建新范围

Question

我真的不明白为什么这段代码会这样工作。

我调用我的服务并返回预期的数据。我希望单独存储图片，因为我需要修改数组并将其解析为不同的新范围。我不明白的是，我现在已经创建了 2 个范围，产品和产品图片 - 为什么它们仍然链接？

如果我使用 Lodash 来 _.sort() productPictures，那么 scope.Product 内的 Images 对象也会被更改，但是我不希望这种情况发生，而且我不知道如何隔离 $scope.productPictures .我尝试将范围处理为简单的 js 变量，例如 var product;和 var productPictures，但是当我根据服务的响应设置它们的数据时，它们仍然是链接的。

$api.productpage.query({
    id: parseInt($stateParams.productId)
}, function (data) {
    $scope.product = data[0];

    $scope.productPictures = data[0]['Images'];
});

我是否忽略了一些非常微不足道的事情？我是否应该在单独的服务请求中管理产品图片？

Answer 1

对象在 javascript 中通过引用传递。这意味着在这段代码中

$scope.product = data[0];
$scope.productPictures = data[0]['Images'];

$scope.productPictures 指向与data[0].Images 相同的对象（我猜这是数组）。

要克服这个问题，您需要克隆对象而不仅仅是引用。您可能需要检查angular.copy 方法：

$scope.productPictures = angular.copy(data[0].Images);

Answer 2

您在作用域而不是两个作用域中创建两个变量。

对象是通过引用传递的，所以如果你修改一个，它会修改另一个。 也许尝试克隆对象

编辑使用 angular.copy() 而不是 jquery.extend()

function myclone ( obj){
   return jQuery.extend(true, {}, obj);  
}