AngularJS $q allSettled implementation
by DineshAngappa
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
<div ng-app="test">
<h2>$q test</h2>
<div ng-controller="TodoCtrl">
<div ng-bind="'Promise1: ' + Promise1"></div>
<div ng-bind="'Promise2: ' + Promise2"></div>
<div ng-bind="'Promise3: ' + Promise3"></div>
<div ng-bind="'Promise4: ' + Promise4"></div>
<div ng-bind="'Promise5: ' + Promise5"></div><br />
<div ng-bind="'Status1: ' + StatusAll"></div>
<div ng-bind="'Status2: ' + StatusFinally"></div>
<div ng-bind="'Status3: ' + StatusAllSettled"></div>
</div>
</div>
JavaScript
function TodoCtrl($scope, $q, $timeout) {
function createPromise(name, timeout, willSucceed) {
$scope[name] = 'Running';
var deferred = $q.defer();
$timeout(function() {
if (willSucceed) {
$scope[name] = 'Completed';
deferred.resolve(name);
} else {
$scope[name] = 'Failed';
deferred.reject('fail');
}
}, timeout * 1000);
return deferred.promise;
}
// Create 5 promises
var promises = [];
var names = [];
for (var i = 1; i <= 5; i++) {
var willSucceed = true;
if (i == 2 || i == 4) willSucceed = false;
promises.push(createPromise('Promise' + i, i, willSucceed));
}
// Wait for all promises
$scope.StatusAll = 'Waiting';
$scope.StatusFinally = 'Waiting';
$scope.StatusAllSettled = 'Waiting';
$q.all(promises).then(
function(results) {
$scope.StatusAll = 'Success';
console.log(results);
},
function(results) {
$scope.StatusAll = 'Failed';
console.log(results);
}
).finally(function() {
$scope.StatusFinally = 'Done waiting';
});
$q.allSettled(promises).then(
function(results) {
$scope.StatusAllSettled = 'Success';
console.log('results', results);
},
function(results) {
$scope.StatusAllSettled = 'Failed';
console.log('results', results);
}
);
}
// Create module
angular.module('test',[]);
// Add extra functionality to $q
angular.module('test').config(['$provide', function ($provide) {
$provide.decorator('$q', ['$delegate', function ($delegate) {
var $q = $delegate;
// Extention for q
$q.allSettled = $q.allSettled || function (promises) {
var deferred = $q.defer();
if (angular.isArray(promises)) {
var states = [];
var results = [];
var...