Angular服务调用另一个服务

时间:2014-09-30 09:34:59

标签: javascript angularjs

我正在制作一个简单的Angular应用来管理收入。收入来自我存储在json中的项目(用于测试目的)。

所以,基本上,我在Angular中使用一个服务来获取这个json,我希望有另一个服务调用Projects服务并过滤每个项目的收入。

以下是代码:

facturateApp.service('Projects', function($http){     


 var Projects = {
      async: function() {

        var promise = $http.get('base.json').then(function (response) {            
          return response.data;
        });
        return promise;
      }
    };
    return Projects;


});

facturateApp.service('Incomes', function(Projects){    
    var incomes = []; 
    Projects.async().then(function(d) {
      var projects = d;

      angular.forEach(projects, function(project){

        if(typeof(project.account.accountAmount) == 'number' && project.account.accountAmount > 0){
            var newIncome = {};
            newIncome.projectName = project.projectName;
            newIncome.clientName = project.clientName;
            newIncome.typeIncome = "Accompte";
            newIncome.amount = project.account.amountAccount;
            newIncome.date = project.account.accountDate;
            newIncome.notes = project.account.accountType;
            incomes.push(newIncome);


        }



      });
      angular.forEach(projects, function(project){


        if (typeof(project.total.totalAmount) == 'number' && project.total.totalAmount > 0){
            var newIncome = {};
            newIncome.projectName = project.projectName;
            newIncome.clientName = project.clientName;
            newIncome.typeIncome = "Accompte";
            newIncome.amount = project.total.totalAmount;
            newIncome.date = project.total.totalDate;
            newIncome.notes = project.total.totalType;
            incomes.push(newIncome);


        }


      });

    });
    console.log(incomes); // still returns [];
    return incomes;

});

我的问题是最后一个日志返回一个空数组。实际上它按预期工作:incomes在执行Projects.async().then(function(d)之前返回。

但是我不知道在调用另一个服务的服务中返回incomes之前等待执行此函数...

任何帮助?

1 个答案:

答案 0 :(得分:3)

这是异步调用的工作原理:如果Incomes服务数据以异步方式填充,那么它也必须返回promise。

我会创建一些方法buildAndGetIncomes,它会调用Projects.async()并在获取数据时使用>向控制者返回新的承诺:

facturateApp.service('Incomes', function(Projects, $q){

    var self = this;

    var deferred = $q.defer();    
    var incomes = []; 

    self.buildAndGetIncomes = function(){

        Projects.async().then(function(d) {
      var projects = d;

      angular.forEach(projects, function(project){

        if(typeof(project.account.accountAmount) == 'number' && project.account.accountAmount > 0){
            var newIncome = {};
            newIncome.projectName = project.projectName;
            newIncome.clientName = project.clientName;
            newIncome.typeIncome = "Accompte";
            newIncome.amount = project.account.amountAccount;
            newIncome.date = project.account.accountDate;
            newIncome.notes = project.account.accountType;
            incomes.push(newIncome);
        }
      });

      angular.forEach(projects, function(project){


        if (typeof(project.total.totalAmount) == 'number' && project.total.totalAmount > 0){
            var newIncome = {};
            newIncome.projectName = project.projectName;
            newIncome.clientName = project.clientName;
            newIncome.typeIncome = "Accompte";
            newIncome.amount = project.total.totalAmount;
            newIncome.date = project.total.totalDate;
            newIncome.notes = project.total.totalType;
            incomes.push(newIncome);
        }
      });

     deferred.resolve(incomes);      
    });

    return deferred.promise;    
    };    
});

我们打电话给控制器:

Incomes.buildAndGetIncomes().then(function(incomes) {
   // ...
}, function(error) {
  // ..
});