Question

55

AngularJS wait for all async calls inside foreach finish

rated 0 times [ 58] [ 3] / answers: 1 / hits: 33322 / 10 Years ago, thu, april 3, 2014, 12:00:00

I am looping through an array with angular.forEach and calling a non-angular ajax library (Trello client.js). The client does have 'success' and 'error' callbacks, but doesn't return an angular deferred. I would like to execute a function once all of the ajax calls have completed.

I have the following code:

$scope.addCards = function(listId)

            {

                var cardTitles = $scope.quickEntryCards[listId].split('n');

                angular.forEach(cardTitles, function(cardTitle,key)

                {

                    Trello.post('/cards', {

                        name:cardTitle,

                        idList:listId

                    },function(){ }, function(){ });

                });

                //TODO: wait for above to complete...

                $scope.init($routeParams.boardId);  

                $scope.quickEntryCards[listId] = '';    

            };

What can I do at that //TODO and in the callback functions so that the last 2 lines only run after all the posts either succeed or fail?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kalistaz

Add To Favorites

Follow

Total Points: 0

Total Questions: 100

Total Answers: 106

Location: Bermuda

Member since Thu, Apr 20, 2023

1 Year ago

answered 10 Years ago alejandro · Accepted Answer

pseudo code using angular's $q service.

requests = [];



forEach cardTitle

   var deferred = $q.defer();

   requests.push(deferred);

   Trello.post('/path', {}, deferred.resolve, deferred.reject);



$q.all(requests).then(function(){

    // TODO

});