AngularJS中多個$ http請求的最佳實踐是什么？

Question

例如，我有一個控制器向用戶顯示列表視圖，一些列需要數據來自另一個端點，所以我憑直覺寫了這些，您能告訴我如何重構它們嗎？

$http.get($scope.urlA)
  .success(function(res){
    $scope.dataA = res.data;

    $http.get($scope.urlB)
      .success(function(res){
        $scope.dataB = res.data;
      })
      .error(function(err){
        if (err) throw err;
      });
  })
  .error(function(err){
    if (err) throw err;
  });

Answer 1

然后，最佳實踐是兩個為兩個$ http.get調用創建兩個工廠方法。 在Angular $ http中，本身會調用promises，因此您的工廠將如下所示：

myapp.factory('getHttpData',function($http){
    return{
        getURLA:function(){
            return $http.get('/urlA');
        },
        getURLA:function(){
            return $http.post('/urlB');
        }
    }
});

然后，在Controller中，您可以像這樣調用兩個工廠函數：

  .controller('testCtrl',['getHttpData',function(getHttpData){
       getHttpData.getURLA().then(function(data){
              //do whatever you want
              getHttpData.getURLB().then(function(Bdata){
                 //do whatever you desire
              }):
       });
  });

Answer 2

看起來第二個調用並不取決於第一個調用，因此您可以單獨調用它們：

$scope.data = {};

$http.get('http://example/url/a')
    .success(function(data) {
        $scope.data.a = data;
    });

$http.get('http://example/url/b')
    .success(funciton(data)) {
        $scope.data.b = data;
    });

如果呼叫b依賴於呼叫a中的數據，則呼叫a的成功回調中的服務b。