Angular recursive factory method - angularjs

Question

I would like to ask is it possible to return recursive factory method. I will show some code so you could understand me more.
We have factory:
angular.module('module')
.factory('synchronizationStatus', ['$http', 'apiBase', '$timeout', function ($http, apiBase, $timeout) {
var service_url = apiBase.url;
function syncCompleted ( correlationId ) {
checkSync (correlationId)
.then(function(response){
$timeout(function() {
// if I get response.data true, i want to proceed to controller
if(response.data){
return "now I want to return result to controller"
}
else {
// check again
checkSync(correlationId)
}
}, 500);
})
}
function checkSync( correlationId ){
return $http.get(service_url + query);
}
return {
syncCompleted: syncCompleted
};
}]);
Main idea with this factory method is that i constantly (every 500ms each) send ajax request to backend and check if some operation is completed or no, and when it is completed i would like to send promise to controller function, which looks like this:
function save( client ) {
clients.addClient( client )
.then( function(response) {
synchronizationStatus.syncCompleted(response.data.CorrelationId);
}, onSaveError)
.then( redirectToList, onSaveError )
.finally( unblock );
}
after backend returns true to my factory method i would like to execute other functions in my controller. Of course I could do recursion in my controller and it would solve this problem. Although I have to reuse this recursion in many other controllers so I would like to reuse this method.

Answer 1

Yes, you should be able to do this, but you need to change the code in your factory a little:
angular.module('module')
.factory('synchronizationStatus', [
'$http',
'apiBase',
'$timeout',
function ($http, apiBase, $timeout) {
var service_url = apiBase.url;
function waitSyncCompletion( correlationId ) {
return checkSync (correlationId)
.then(function(response){
if (response.data) {
return "all done!";
}
return $timeout(function() {
// check again
return waitSyncCompletion(correlationId);
}, 500);
});
}
function checkSync( correlationId ){
var query = '...'; // determine query
return $http.get(service_url + query);
}
return {
waitSyncCompletion: waitSyncCompletion
};
}
]);
Then in your controller, you would need to use a return so that you can wait for the operation to complete:
function save( client ) {
clients.addClient( client )
.then( function(response) {
return synchronizationStatus.waitSyncCompletion(response.data.CorrelationId);
})
.then(function (result) { console.log(result); })
.then( redirectToList )
.catch( onSaveError )
.finally( unblock );
}

Answer 2

Make use of a custom deferred (promise), using Angular's $q. Make sure that you inject the $q dependency in your factory and create the deferred at the start of your factory:
var deferred = $q.defer()
At the point where the promise must resolve, add:
deferred.resolve();
And make sure you return the promise at the bottom of your syncCompleted function:
return deferred.promise;
Additionally, you could add deferred.reject() if you also want error-handling. Furthermore, you could add arguments to reject() and resolve() if you need to.
As an alternative, you could achieve the same goal without using $q. $timeout() also returns a promise, and if you return a promise in the callback given to then(), it will kind of 'replace' the 'parent' promise.