How to iterate over array objects inside of a function

Question

I have vs.selectedTags which is an array with 3 objects.

In my for loop which will run 3 times, I need to make 3 API calls to get the tickers data for each object which I'm able too.

My problem comes when I try to assign those tickers to each vs.selectedTags[i].tickers object in the array.

It can't iterate over the i inside of the ApiFactory call. i becomes 3, and I have to cheat by using [i-1] to stop it from erroring out. However i still stays stuck at 2 so it always saves the last tickers data to all the items in my vs.selectedTags array.

var vs = $scope;

for (var i = 0; i < vs.selectedTags.length; i++) {

    console.log(i);

    vs.selectedTags[i].tickers = '';

    console.log(vs.selectedTags[i].tickers);

    ApiFactory.getTagData(vs.chosenTicker, vs.selectedTags[i].term_id).then(function(data) {

        // console.log(data.data.ticker_tag);
        console.log(data.data.ticker_tag.tickers);

        console.log(i-1);

        // console.log(vs.selectedTags[0]);

        // How would you properly iterate [0 - 1 - 2] here?
        vs.selectedTags[i-1].tickers = data.data.ticker_tag.tickers;

        console.log(vs.selectedTags[i-1]);
    });
}

Leon Gaban · Accepted Answer · 2015-04-22 20:12:22Z

1

You need a closure / new scope, as the ApiFactory.getTagData function is asynchronous

for (var i = 0; i < vs.selectedTags.length; i++) {
    (function(j) {

        vs.selectedTags[j].tickers = '';

        ApiFactory.getTagData(vs.chosenTicker, vs.selectedTags[j].term_id).then(function(data) {

             vs.selectedTags[j].tickers = data.data.ticker_tag.tickers;
        });
    })(i);
}

edited Apr 22, 2015 at 20:12

Leon Gaban

39.4k123 gold badges351 silver badges553 bronze badges

answered Apr 22, 2015 at 20:04

adeneo

319k29 gold badges410 silver badges392 bronze badges

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

1 Comment

adeneo Over a year ago

All it takes is a function, and an IIFE is a function and it creates a new scope. Some like it, some think it's better to have to code in a seperate function, I think it depends, if it's just simple code inside a loop just wrapping it in an IIFE makes it easier for me to read than moving code out.

Leon Gaban · Accepted Answer · 2015-04-22 20:12:11Z

1

if you put the stuff inside of your for loop in a separate function it will fix your closure issue. so:

var bob = function(i){
    console.log(i);

    vs.selectedTags[i].tickers = '';

    console.log(vs.selectedTags[i].tickers);

    ApiFactory.getTagData(vs.chosenTicker, vs.selectedTags[i].term_id).then(function(data) {

        // console.log(data.data.ticker_tag);
        console.log(data.data.ticker_tag.tickers);

        console.log(i);

        // console.log(vs.selectedTags[0]);

        // How would you properly iterate [0 - 1 - 2] here?
        vs.selectedTags[i].tickers = data.data.ticker_tag.tickers;

        console.log(vs.selectedTags[i]);
    });
}

for (var i = 0; i < vs.selectedTags.length; i++) {
    bob(i);
}

edited Apr 22, 2015 at 20:12

Leon Gaban

39.4k123 gold badges351 silver badges553 bronze badges

answered Apr 22, 2015 at 20:05

Delta

8611 gold badge6 silver badges12 bronze badges

1 Comment

Leon Gaban Over a year ago

Thanks this also works :) +1 Sigh, yeah this is probably where I would have finally ended up at... I like @adeneo's neat solution tho

Collectives™ on Stack Overflow

How to iterate over array objects inside of a function

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related