AngularJS更改深度范围对象值

时间:2014-03-24 20:49:10

标签: angularjs object foreach scope

在这里打了一下砖墙,希望得到一些指导。

我正在构建一个名为' display'的范围变量。这是建立了2个http电话,我没有包括,以保持简单。基本上我所做的就是在每个类别对象中添加产品类型。

$scope.display = {};

portal.fetchCategories().then(function(data) {
    $scope.categories = data.categories;
    return portal.fetchProductTypes();
})
.then(function(data) {
    $scope.productTypes = data.product_types;

    angular.forEach($scope.categories, function(value) {
        $scope.display[value.id] = {
            title: value.title,
            start: value.start,
            end: value.end,
            product_types: $scope.productTypes
        };
    });
})

一切正常。

我遇到的麻烦是当我在这样的类别中定位产品类型并尝试更新标题时:

$scope.display[2].product_types[0]['title'] = "Updated Title";

实际上,它更新了所有类别中的产品类型标题,而不仅仅是指定的类别。我怀疑它只是更新$ scope.productTypes。

任何人都可以解释我做错了什么吗?

1 个答案:

答案 0 :(得分:1)

问题是相同的对象引用与所有要显示的产品类型相关联。你可以通过制作productTypes的副本来解决这个问题,如果这样就足够了而不是问题。

angular.forEach($scope.categories, function(value) {
    $scope.display[value.id] = {
        title: value.title,
        start: value.start,
        end: value.end,
        product_types: angular.copy($scope.productTypes)
    };
});