Dynamically changing the Angular $scope variables

Question

I have two arrays (scope variables) whose values are getting updated dynamically, but in the HTML when I am trying to print their values, the view is not taking the updated ones.

<div>
    <!-- array printing -->
    <span ng-repeat="var in array track by $index">{{var}}</span>
</div>
<div>
    <!-- array -->
    <span ng-repeat="var in array2 track by $index">{{var}}</span>
</div>

When I am printing the values in the console log, the array is changing but its changes are not getting reflected in the page.

controller.js

$scope.update = function() {

    $scope.array.push(box); 

    // inside an ajax call
    var index = $scope.array.indexOf(box);

    if(index > -1) {
        $scope.array.splice(index,1);
        console.log("index "+index);
    }  
}

On what action array gets updated? Can u pls provide controller js? — Navaneet
– Navaneet, Commented Jun 12, 2015 at 7:41

Zanon · Accepted Answer · 2015-06-13 14:53:53Z

1

It seems that your Ajax call is not being called by AngularJS. Maybe you're using jQuery?

In this case, try using $scope.$apply(); after the end of the Ajax callback function. It will verify any changes and update your view variables.

You can read more about $apply here and here.

answered Jun 13, 2015 at 14:53

Zanon

31k21 gold badges119 silver badges127 bronze badges

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

1 Comment

user2851669 Over a year ago

Yeah it worked. Thanks :) I had to call the digest loop.

Collectives™ on Stack Overflow

Dynamically changing the Angular $scope variables

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