Angular:一次多个控制器调用服务

Question

这应该是一个相当直接的问题,但我很难过.

我有一个服务,进行http调用,然后对结果进行广泛的后处理.我希望将处理结果分配给$ scope.variable并在几个不同的视图中使用.问题是我为每个视图都有单独的控制器,但我不希望每个控制器调用服务以从资源获取相同的数据并为每个控制器进行一次后处理.

超级简化我有这个:

myModule.factory ('Data', function ($http, $q) {
  getData: $http.get...
  processData: this.getData().success(function(data){
    ... do a ton of cpu intensive processing ... 
    return processed_data
ctrl1 = function(Data,$scope) {
  $scope.data = Data.processData()
  }
ctrl2 = function(Data,$scope) {
  $scope.data = Data.processData()
etc...
}

显然我想设置$ scope.data = Data.processData()一次,并让它填充所有控制器.就目前而言,每个控制器都独立调用服务,这会产生不必要的流量和CPU.

我确信有一些简单的东西,但我无法弄清楚.有没有办法创建一个"超级"范围,我可以定义所有控制器范围共有的变量？

谢谢,

Answer 1

我看到你注入了$ q服务.为什么不在$http.get...数据服务中返回一个承诺(就像)在cpu密集处理完成时解析？您还可以执行angular $ resource服务并返回一个空对象,该对象在处理完成后会被填充(在下面的示例中,我假设processed_data是一个数组,但它也可以用于对象):

myModule.factory ('Data', function ($http, $q) {
  var deferred = $q.defer();
  var futureResult = [];
  //will get populated once processing is done, and is basically a cache

  $http.get('url').success(function(data){
    //... do a ton of cpu intensive processing ...
    for(var i=0; i<processed_data.length; i++){
      futureResult[i] = processed_data[i];
    }
    deferred.resolve(futureResult);
  });

  return {
    getProcessedDataPromise:function(){
     return deferred.promise;
    }
    ,getProcessedData:function(){
      return futureResult;
    }
  }
});

在控制器中

ctrl1 = function(Data,$scope){
  Data.getProcessedDataPromise().then(function(data){
    $scope.data = data;
  });
}
ctrl2 = function(Data,$scope){
  $scope.data = Data.getProcessedData();
}

您还可以查看此plnkr示例.