AngularJS从作用域创建新作用域

Question

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

我调用我的服务并获得返回的预期数据。我希望单独存储图片，因为我需要修改数组，并根据新的作用域对其进行不同的解析。我不明白的是，我现在已经创建了两个作用域，产品和productPictures --为什么它们仍然是联系在一起的？

如果我对_.sort() productPictures使用Lodash，那么scope.Product中的图像对象也会被改变，但是我不希望这种情况发生，我也不知道如何隔离$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);  
}