Handling Results Returned from Angular $q.all

Question

I'm somewhat confused on how the results return from $q.all should be handled.

Here is my code...

  var pageLoad = function () {

        var pageLoadPromises = [
            youEmployerData.getEmployerPrograms($scope.employerId),
            youEmployerData.getWorksites($scope.employerId) 
        ];

        $q.all(pageLoadPromises)
        .then(function (results) {

            $scope.programs = results[0];
            $scope.worksites = results[1];
            $scope.appLoaded = true;

        }, function (r) {

            handleResourceError(r);

        });

    };

Here are my actual resource calls..

you.factory('youEmployerData', function ($resource) {

    return {

        getEmployerPrograms: function(employerId) {
             return $resource("/api/programs/getemployerprograms?employerId=:id").query({ id: employerId });
         },

        getWorksites: function (employerId) {
             return $resource("/api/employer/getworksites?employerId=:id").query({ id: employerId });
         }
      }
   }

I have verified my resource calls work correctly, I just know I'm doing something wrong inside the then(function(results) { - I'm just not quite sure how to handle that data.

Also - $scope.worksites should be an array of worksites that is returned, and $scope.programs an array of programs.

Please let me know if you have any questions or need additional clarification.

Here is the screenshot of console.log(results) - which appears correct, results[0] only have 1 item and results 1 ($scope.worksites) - having multiple items, the only problem is something isn't working because the $scope.worksites it not outputting on the screen correctly, its like the array isn't correct or something. Sorry - hard to describe.

Answer 1

Maybe it is because you missed the fact that a $resource object is not a promise? Can you try with:

    var pageLoadPromises = [
        youEmployerData.getEmployerPrograms($scope.employerId).$promise,
        youEmployerData.getWorksites($scope.employerId).$promise 
    ];