angularjs – Angular.JS消除两个异步服务调用,然后在两个完成后执行操作

我还在围绕Angular.JS包围我的大脑.

我有两个独立的$http呼叫从远程Web服务中检索数据.我有一个动作,我要在两个服务呼叫完成后才能启动.

>第一个服务调用将填充$scope.model
>第二个服务调用,修改$scope.model中的数据(它添加了在视图中渲染的一些计数器属性)

另一个独特的要求是,最终将使用$scope.model在控制器外调用和更新第二个服务调用.这是一个通知消息泵.

我猜想我会使用承诺$q和可能的$服务,但我不太确定从哪里开始像这样的一些最佳实践.

我知道在这里听起来不像异步调用是合适的,因为我的例子可以通过同步来简化.但是,第二个服务调用是一个通知更新程序,所以它将不断地被查询到服务器(最终将使用一个websocket).

这是我在这个应用程序中看到的常见模式.

你会想要使用$q承诺.特别是$q.all().所有$http方法将返回承诺. $q.all([promise,promise,promise]))然后(doSomething)将等待所有的承诺解决,然后调用doSomething将承诺结果的数组传递给它.

app.service('myService',['$http','$q',function($http,$q) {
   return {
      waitForBoth: function() { 
          return $q.all([
             $http.get('/One/Thing'),$http.get('/Other/Thing')
          ]);
      };
   }
}]);

然后叫它：

app.controller('MyCtrl',['$scope','myService',function($scope,myService) {
   myService.waitForBoth().then(function (returnValues){
       var from1 = returnValues[0].data;
       var from2 = returnValues[1].data;
       //do something here.
   });
}]);

这是为你示范Plunker.