使用 angularjs 为多个 HTTP GET 请求获取更清晰的代码答案

【问题标题】：Getting cleaner code for multiple HTTP GET requests with angularjs使用 angularjs 为多个 HTTP GET 请求获取更清晰的代码
【发布时间】：2016-02-04 08:51:23
【问题描述】：

我一直在思考使用 angularjs 进行 HTTP GET REST 调用的 3 种方法。它们是 $http、ngResource 和 restangular。我选择了 $http，因为它最简单并且代码可读性最强。但是，我的 REST 调用变得越来越复杂。我需要发出嵌套的 HTTP GET 请求并确保请求以正确的顺序运行。如果一个失败，整个 HTTP GET 请求链都会停止。

代码看起来像这样；

$http.get(url_get1).success(function(data, status, headers, config)
{
    $http.get(url_get2).success(function(data, status, headers, config)
    {
         $http.get(url_get3).success(function(data, status, headers, config)
         {
             //more action
         }
    }
}

如果 HTTP 请求链变长，代码将变得不可读。

使用 ngResource 或 restangular 会使代码更具可读性和可维护性吗？还是有其他方法？

【问题讨论】：

如果您需要确保您的呼叫按特定顺序运行，那么我会认真考虑原因。如果您需要来自一个请求的数据来决定如何处理来自另一个请求的数据，请将其拉入一个变量中
变量内容需要先从HTTP GET中获取。所以，我认为我无法避免让调用按特定顺序运行。
链接承诺而不是嵌套。使代码更易于阅读和维护

标签： angularjs rest http-get restangular ngresource

【解决方案1】：

您的问题不在于获取请求，而在于更好的编码承诺方式。你需要做的是创建更多的模块化函数，这些函数能够处理传入的数据，并返回你需要的东西。例如：

function dataFromGetA(data){
    // modify your first get calls data here to the variable, or url you need for the next call
    return $http.get('http://someurl.com/' + data.someKey);
}

function dataFromGetB(data){
    return $http.get('http://someotherurl.com/' + data.somethingElse);
}

一旦您创建了一组此类函数，就可以轻松地将它们链接起来，如下所示：

$http.get(firstUrl)
    .then(dataFromGetA)
    .then(dataFromGetB);

请注意，我并没有简单地将 $http 调用链接在一起，正如您提到的，您需要来自先前调用的数据来计算下一个调用的 url。

【讨论】：

另一个值得 10 票的好答案！看来我真的可以坚持$http了。

【解决方案2】：

$http.get() 返回一个承诺。

$http.get(url_get1)
   .then($http.get(url_get2))
   .then($http.get(url_get3))

阅读一下promises

另外，检查这个答案：How to bundle Angular $http.get() calls?

【讨论】：

很好的答案。似乎我可以坚持使用 $http。我希望我能投票 100 次。
对不起，我选择了另一个答案作为答案。