AngularJS changing deep scope object value

Question

Hit a bit of brick wall here so hoping for some guidance.

I'm building up a scope variable called 'display' which is built off 2 http calls which I haven't included to keep it simple. Basically all i'm doing is adding product types to the each category object.

$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
        };
    });
})

This all works fine.

The trouble I'm having is when I target a product type inside a category like this and attempt to update the title:

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

It is actually updating the product type title in all the categories rather than just specified category. I suspect it's just updating $scope.productTypes.

Can anyone shed any light on what I'm doing wrong?

dmahapatro · Accepted Answer · 2014-03-24 20:57:51Z

1

Problem is that the same object reference is associated with all product types for display. You can overcome this by making a copy of productTypes, if that suffices and not a problem.

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)
    };
});

answered Mar 24, 2014 at 20:57

dmahapatro

50.4k7 gold badges94 silver badges122 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

thats4shaw Over a year ago

That's great. Much appreciated - had a feeling it would be something like this.

Collectives™ on Stack Overflow

AngularJS changing deep scope object value

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related