Retrieving data from promise | Angularjs - angularjs

Question

I'm trying to add a top posted section on my dashboard. Getting the top 'captures' aka posts wasn't an issue, though working with Auth0, I need to link the user info with the corresponding users.
Currently I am getting a promise in my dataObj that I pass along to check who made the most votes, but seeing it's asynch I'm having issues retrieving the data and putting it into the users variable:
app.controller('dashboardCtrl', ['$scope', '$http', 'captureApi', 'userApi', 'filterFilter', '$q', function($scope, $http, captureApi, userApi, filterFilter, $q){
$scope.captures = [];
$scope.pageSize = 4;
$scope.currentPage = 1;
$scope.topPosters = [];
captureApi.getAllCaptures().then(function(res) {
$scope.captures = res.data;
userApi.getUsers().then(function(res){
$scope.getCount = function getCount(strCat){
return filterFilter( $scope.captures, {userId:strCat}).length;
};
var users = res.data.users;
var i;
for(i=0; i<users.length; i++) {
var userId = users[i].user_id;
console.log(userId);
console.log($scope.getCount(userId));
$scope.user = userApi.getUser(userId).then(function(res){
$scope.userInfo = res.data;
console.log($scope.userInfo);
return res.data;
});
var dataObj = {
user : $scope.user,
userId : userId,
amountPosted : $scope.getCount(userId)
};
$scope.topPosters.push(dataObj);
}
console.log($scope.topPosters[0].user);
});
});
}]);
As you can see, I get all the captures, then I count them depending on their userId.
Once this is done I add them to the dataObj.
But in between I'm trying to add the user information (using userApi.getUser(ID) and also add their information to this dataObj. At the moment I'm getting a promise. How do I convert this into the dataObj of each user.

Answer 1

Try to load all data before pushing to topPosters. An example:
app.controller('dashboardCtrl', ['$scope', '$http', 'captureApi', 'userApi', 'filterFilter', '$q', function ($scope, $http, captureApi, userApi, filterFilter, $q) {
$scope.captures = [];
$scope.pageSize = 4;
$scope.currentPage = 1;
$scope.topPosters = [];
$scope.getCount = function getCount(strCat) {
return filterFilter($scope.captures, {userId: strCat}).length;
};
$q.all({captures: getAllCaptures(), users: getUsers()}).then(function(collections) {
$scope.captures = collections.captures;
return collections.users;
}).then(function (users) {
return $q.all(users.map(function (user) {
return getUserById(user.userId);
}));
}).then(function (users) {
$scope.topPosters = users.map(function(user) {
//I think your user has propery "id" or similar
return {
user: user,
userId: user.id,
amountPosted: $scope.getCount(user.id)
}
});
console.log($scope.topPosters);
});
function getAllCaptures() {
return captureApi.getAllCaptures().then(function (res) {
return res.data;
});
}
function getUsers() {
return userApi.getUsers().then(function (res) {
return res.data.users;
});
}
function getUserById(userId) {
return userApi.getUser(userId).then(function (res) {
return res.data;
});
}
}]);