AngularJS warten auf alle async Anrufe innerhalb foreach Ende

Question

Ich bin durch ein Array mit angular.forEach durchschleifen und eine nicht-eckige Ajax-Bibliothek (Trello client.js) aufrufen. Der Client hat "Erfolgs-" und "Fehler" -Rückrufe, gibt jedoch keine Winkelrückstellung zurück. Ich würde gerne eine Funktion ausführen, sobald alle Ajax-Aufrufe abgeschlossen sind.

Ich habe den folgenden 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] = '';  
      }; 

Was kann ich in diesem // TODO tun und in den Callback-Funktionen, so dass die letzten 2 Zeilen nur nach all den Pfosten laufen entweder Erfolg oder Misserfolg?

Answer 1

Pseudo-Code mit eckigen $ 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 
}); 

Answer 2

Werfen Sie einen Blick auf die Async-Bibliothek https://github.com/caolan/async.

So können Sie entweder alle Ihre asyn Funktionen parallel oder seriell ausführen und Ihr gemeinsamer Callback wird ausgeführt, sobald alle fertig sind.

async.parallel([ 
    function(){ ... }, 
    function(){ ... } 
], callback); 

async.series([ 
    function(){ ... }, 
    function(){ ... } 
]); 

Hoffe es hilft.

Answer 3

einfach, Sie dieses

tun können

var jsonArray3=[]; 
angular.forEach($scope.jsonArray1,function(value,key){ 
    angular.forEach(jsonArray2,function(v,k){ 
     if(v.id==value.id){ 
      $scope.jsonArray3.push(v); 
     } 
    }) 
}) 



$q.all($scope.jsonArray3).then(function(data){ 
    console.log("data:",data); 
}) 

Answer 4

für die Suche nach der Antwort suchen, um den Titel Frage „AngularJS für alle Asynchron-Anrufe innerhalb foreach Finish warten“, hier ist eine generische Art und Weise zu erreichen, ist es, auch die Winkel $ q-Dienst:

$scope.myArray = [1, 2, 3, 4, 5, 4, 3, 2, 1]; 
var loopPromises = []; 
angular.forEach($scope.myArray, function (myItem) { 
    var deferred = $q.defer(); 
    loopPromises.push(deferred.promise); 
    //sample of a long-running operation inside loop... 
    setTimeout(function() { 
     deferred.resolve(); 
     console.log('long-running operation inside forEach loop done'); 
    }, 2000); 

}); 
$q.all(loopPromises).then(function() { 
    console.log('forEach loop completed. Do Something after it...'); 
}); 

Hier ist ein funktionierendes sample.

Answer 5

Sie können auch map verwenden:

var requests = cardTitles.map(function(title) { 
    var deferred = $q.defer(); 
    Trello.post('/path', {}, deferred.resolve, deferred.reject); 
    return deferred; 
}); 

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

}); 

Und wenn die post Methode gibt bereits ein Versprechen:

var requests = cardTitles.map(function(title) { 
    return $http.post('/path/' + title, {}); 
}); 

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

});