The issue
I have 5 work queues and each queue has 5 tasks.
First, I make an API call to get all work queues. I then send an ID from each queue to another endpoint which gets me the tasks for that queue.
I'm trying to push all tasks from all queues into one array, so ideally the end product would be an array of 25 tasks.
Due to Angular's asynchronous nature, I'm having trouble getting all the data into the right place at the right time.
My current code
var getAllTasks = function () {
var deferred = $q.defer();
var allTasks = [];
qSrv.getQueues().then(function (response) {
// Loop through all queues
response.data.forEach(function (e, i) {
// Get Queue task list by passing in Global Unique Identifier to endpoint
qSrv.getQueueByQueueGuid(e.workQueueGuid).then(function (queue) {
// Push all tasks within task list to one array
queue.data.taskList.forEach(function (ee, ii) {
ee.queueName = e.name;
allTasks.push(ee);
});
});
});
// Resolve promise with arrays of all 25 tasks
deferred.resolve(allTasks);
})
return deferred.promise;
}
Conclusion
I know there's something funky going on with the promises not finishing before being passed along to the next step, but I don't know how to structure it to avoid this problem.
I would appreciate any and all help, thank you.