Broadcasting in a loop in angular does not give updated values in receiver

Question

I'm broadcasting a set of coordinates and want that coordinates shown by a marker updated in every second.

         var broadcastData = function (data) {
           console.log("broadcasting data");
           $rootScope.$broadcast('broadcast-started', data);
        };


            var waitingTime = 1000;

            for(var i =0; i<data.length; i++){
                var element = data[i];

                var coordinates = new Object();
                coordinates.latitude = element.LATITUDE;
                coordinates.longitude = element.LONGITUDE;

                setTimeout(function(){ broadcastData(coordinates);}, waitingTime);
                waitingTime = waitingTime+1000;
            }

Reciever

   $scope.$on('broadcast-started', function (event, args) {
        console.log(args);

        console.log("received");
        marker.setLatLng([args.latitude, args.longitude]);

    });

Output:

Problem is even though coordinates are different in each iteration only the first set of coordinates are shown each time? I don't understand why that's happening

Is the object the last object in data? I'm guessing you're changing the reference coordinates — Peheje
– Peheje, Commented Nov 3, 2016 at 10:31

Priyanka · Accepted Answer · 2016-11-03 10:30:38Z

1

You need to use clouser function like this,

for(var i = 0; i < 10; i++) {
(function(i){  
     var element = data[i];

            var coordinates = new Object();
            coordinates.latitude = element.LATITUDE;
            coordinates.longitude = element.LONGITUDE;

            setTimeout(function(){ broadcastData(coordinates);}, waitingTime);
            waitingTime = waitingTime+1000;
})(i);}

answered Nov 3, 2016 at 10:30

Priyanka

3641 gold badge7 silver badges14 bronze badges

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

3 Comments

Asiri Liyana Arachchi Over a year ago

Why is that and what it does? would you please care to elaborate?

Asiri Liyana Arachchi Over a year ago

This works btw. It would be really good if you can point out what's wrong with my implementation.

Priyanka Over a year ago

@AsiriLiyanaArachchi There is nothing wrong about your code, but implementing $timeout function within loop will take last i th value after loop is over. Using clouser , outer function will create new scope, and inside i will take value equal to i in the loop and remains forever. Have a look at 'javascript clousers' for better undestaning, as i am week at English and unable to explain in more technical words.

Collectives™ on Stack Overflow

Broadcasting in a loop in angular does not give updated values in receiver

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