如何在angular.js中编写更好的顺序承诺调用？

Question

编写这样的代码的一种干净方法是什么？ 我必须多次使用先前请求的响应来从不同的源和表构建新的URL和弹性搜索查询。

$scope.whatIFinallyWant = {};
$http.get(url1).then(function(response1){
    // creating new url2 & query with response1
    $http.get(url2).then(function(response2){
        // creating new url3 & query with response2
        $http.get(url3).then(function(response3){
            // creating new url4 & query with response3
            $http.get(url4).then(function(response4){
                // using the final response in UI ... 
                $scope.whatIFinallyWant = response4;
            }) 
        }) 
    }) 
})

Answer 1

像这样链接诺言

$scope.whatIFinallyWant = {};
$http.get(url1)
.then(function(response1) {
    // creating new url2 & query with response1
    return $http.get(url2);
}).then(function(response2) {
    // creating new url3 & query with response2
    return $http.get(url3);
}).then(function(response3) {
    // creating new url4 & query with response3
    return $http.get(url4);
}).then(function(response4){
    // using the final response in UI ... 
    $scope.whatIFinallyWant = response4;
});

Answer 2

由于$ http.get（）返回已解析的数据（请检查角度文档的确切形状： https ：//docs.angularjs.org/api/ng/service/ $ http），因此您可以使用预定义的函数来形成url并调用$ http.get（）：

let makeUrl = (promiseResult) => {
  let url
  /* some logic */
  return $http.get(url);
}

let logErr = (err) => {
    console.error("Whoops! " + err);
}

$http.get(url1)
  .then(makeUrl)
  .then(makeUrl)
  .then(makeUrl)
  .then((finalUrl) => {
     $scope.whatIFinallyWant = finalUrl;
  })
  .catch(logErr)