javascript - 难以在 Angular js中正确调用函数

Question

我有一个功能通过“app.factory”附加到 Angular 应用程序模块，其中包含某些 http 请求。该函数在 Controller 中调用，函数返回的数据被分配给 Controller 中的范围变量。

问题是首先执行 Controller ，然后执行函数中的 http 请求，因此无法将来自 http 请求的数据捕获到范围变量中。如何纠正。

function resourceapp.factory('dataService', function($http){
  var data = {};
  data.EnterprisePrograms = [];
  data.Resources=[];
  data.Skills=[];
  data.Allocations=[];

  Execution = function($http) {
    $http.get('http://localhost:8080/api/enterpriseProgram')
      .then(function(resources) {
        data.EnterprisePrograms=resources.data;
      });

    $http.get('http://localhost:8080/api/resource')
      .then(function(resources) {
        data.Resources=resources.data;
      });

    $http.get('http://localhost:8080/api/skill')
      .then(function(resources) {
        data.Skills=resources.data;
      });

    $http.get('http://localhost:8080/api/allocation')
      .then(function(allocation) {
        data.Allocations = allocation.data;
      });
  }

  return data;
});

Controller

resourceapp.controller('AllocationList', function($scope, dataService) {
  $scope.allocationList = dataService.Allocations;
});

Answer 1

应该是这样的:

在工厂中:创建一个返回 promise 的方法。

 resourceapp.factory('dataService', function($http){
    var data = {};

    data.getEnterprisePrograms = function($http){
        return $http.get('http://localhost:8080/api/enterpriseProgram');
      }

    data.getResourceData = function($http) {   
        return $http.get('http://localhost:8080/api/resource');
      }

    data.getSkillData = function($http) {
       return $http.get('http://localhost:8080/api/skill');
      }

    data.getAllocationData = function($http) {   
       return $http.get('http://localhost:8080/api/allocation');
    }

    return data;
});

在Controller中，调用工厂方法获取promise并用$q.all()解析它们

 resourceapp.controller('AllocationList', function($scope, dataService, $q){
              var allocationPromise = dataService.getAllocationData();
              var skillPromise= dataService.getSkillData();
              // other promise

 $q.all([allocationPromise,skillPromise, ..other promise]).then(function (result) {
              $scope.allocationData = result[0].data;
             $scope.skillData = result[1].data;
              // other data
          })
 });

参见 this对于 $q.all()