How to change scope objects from callbacks in Angular?

Question

I have simple function in scope which calls some service several times. I want to append retrieved data to the array in the scope.

$scope.foo = function(){
   $scope.someArray = [];
   for(var i = 0; i < something.length; i++){
       var name = something[i];
       FooService.someMethod($resource, name).then(function (result) {
          if(result){
             $scope.someArray.push(name);
          }
       }
   }
}

The problem is someArray in a result is filled with set of the same values. It's the last pushed value repeated something.length times.

How should I handle scope objects if I want to modify them from callbacks?

What exactly do you mean by "modify"? Can you share input and desired output please? — Sergiu Paraschiv
– Sergiu Paraschiv, Commented May 10, 2016 at 8:23
Pick out the items by a specific id and update them. What does your data look like? It would be much easier to help if you provide information on how your things are set up, at the moment this is very vague — Patrick
– Patrick, Commented May 10, 2016 at 8:24
You need to put $scope.someArray = []; out of your function — Tmb
– Tmb, Commented May 10, 2016 at 8:25
@SergiuParaschiv Maybe it's to general question. Basically I want to know how should I properly access scope array inside a callback. As I've written - presented code produces as a result array of the same elements, to be precise it's only last element repeated n times. — Arkadiusz Kałkus
– Arkadiusz Kałkus, Commented May 10, 2016 at 8:27

Thalaivar · Accepted Answer · 2016-05-10 08:36:45Z

3

The for loop is sync where as your $http calls are not.

$scope.foo = function(){
   $scope.someArray = [];
   for(var i = 0; i < something.length; i++){
       (function(i){
       var name = something[i];
       FooService.someMethod($resource, name).then(function (result) {
          if(result){
             $scope.someArray.push(name);
          }
       }
      })(i)
   }
}

answered May 10, 2016 at 8:36

Thalaivar

23.7k5 gold badges63 silver badges71 bronze badges

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

3 Comments

Arkadiusz Kałkus Over a year ago

Thank you so much! This is it. Could you give me some hint to understand it?

Thalaivar Over a year ago

A closure will create a new scope for each iteration. Here is a great article on how closures work... stackoverflow.com/questions/111102/…

Arkadiusz Kałkus Over a year ago

Thank you second time, Thalaivar.

Collectives™ on Stack Overflow

How to change scope objects from callbacks in Angular?

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related