AngularJS - attendere più query di risorse per completare

Question

ho una singola fabbrica definita con ngResource:

App.factory('Account', function($resource) { 
    return $resource('url', {}, { 
     query: { method: 'GET' } 
    }); 
}); 

sto facendo più chiamate al metodo query definita in questa fabbrica. Le chiamate possono avvenire in modo asincrono, ma ho bisogno di aspettare che le chiamate per completare prima di continuare:

App.controller('AccountsCtrl', function ($scope, Account) { 
    $scope.loadAccounts = function() { 
     var billingAccounts = Account.query({ type: 'billing' }); 
     var shippingAccounts = Account.query({ type: 'shipping' }); 

     // wait for both calls to complete before returning 
    }; 
}); 

C'è un modo per fare questo con AngularJS fabbriche definiti con ngResource, simile a quella di jQuery $ .quando() poi.() funzionalità? Preferirei non aggiungere jQuery al mio progetto attuale.

Answer 1

Si desidera utilizzare le promesse e $q.all().

Fondamentalmente, è possibile utilizzarlo per avvolgere tutte le chiamate $ risorse o $ http perché restituiscono le promesse.

function doQuery(type) { 
    var d = $q.defer(); 
    var result = Account.query({ type: type }, function() { 
     d.resolve(result); 
    }); 
    return d.promise; 
} 

$q.all([ 
    doQuery('billing'), 
    doQuery('shipping') 
]).then(function(data) { 
    var billingAccounts = data[0]; 
    var shippingAccounts = data[1]; 

    //TODO: something... 
}); 

Answer 2

Credo che una soluzione migliore è:

$q.all([ 
    Account.query({ type: 'billing' }).$promise, 
    Account.query({ type: 'shipping' }).$promise 
]).then(function(data) { 
    var billingAccounts = data[0]; 
    var shippingAccounts = data[1]; 

    //TODO: something... 
}); 

Answer 3

La soluzione da Ben Lesh è il migliore, ma non è completa. Se è necessario gestire le condizioni di errore - e, sì, è fare - allora è necessario utilizzare il metodo catch sulle API promessa in questo modo:

$q.all([ 
    doQuery('billing'), 
    doQuery('shipping') 
]).then(function(data) { 
    var billingAccounts = data[0]; 
    var shippingAccounts = data[1]; 

    //TODO: something... 

}).catch(function(data) { 

    //TODO: handle the error conditions... 

}).finally(function() { 

    //TODO: do final clean up work, etc... 

}); 

Se non si definisce catch e tutti i tuoi promesse fallire, quindi il metodo then non verrà mai eseguito e quindi probabilmente lascerà la tua interfaccia in cattivo stato.