如何使用 Angular js 遍历 api 中存在的页码答案

【问题标题】：How do I loop through page number present in api using angular js如何使用 Angular js 遍历 api 中存在的页码
【发布时间】：2017-06-23 20:44:39
【问题描述】：

我正在从 api 访问数据。我在请求数据中将 pageSize 设置为 100，因此会有多个页面返回数据。目前，我只得到最后一页中的数据。有没有一种方法可以让我遍历页码并将所有数据存储在一起？

结果 api 如下所示：

所以我想遍历 &page=1 直到不存在下一页。我做 $http.get 的方式是：

function userEventData (resp) {
            $http({
                method: "GET",
                url: resp.results["@href"]
            }).success(function (responseData) {
                logger.info("userEventData responseData", responseData);
                filterEventField(responseData);
                //return responseData;
            });
        }

感谢任何帮助。谢谢

【问题讨论】：

所以问题是你只从最后一页获取数据？这是为什么？你的循环在哪里，你在用数据做什么？是不是日志只显示最后一页数据？
不，我只获得最后一页数据的原因是因为我没有访问所有页面。所以它给了我最近的一个。如果我遍历所有页面并访问数据，那么我将获得每个页面的数据。我无法弄清楚我应该如何遍历 url 内的值。
你知道有多少页提前吗？如果您同时进行大量调用，API 会不会发疯？
不，我不知道会提前多少页。我认为无论如何我们都必须进行 api 调用。
您只需要每次都建立一个新的 url 并一直调用它，直到您不再获取任何数据（假设您无法获取页数）。

标签： angularjs api

【解决方案1】：

看起来你是直接从你的控制器调用 $http - 无论如何你不应该在 Angular 中这样做，在这种情况下你绝对不应该这样做。

相反，您将需要调用一个获取所有数据的服务。你的控制器会做这样的事情。这期望 GetData() 返回一个承诺。当这个承诺得到解决时，它会对数据做一些事情。

function userEventData (resp) {
    PagedDataService.GetData().then(function(data) {
        filterEventData(data)
    });
}

这个版本的服务应该可以工作，尽管您需要填写代码来向“数据”添加信息并确定是否有另一个页面。

请注意，$http 响应对象有几个属性可以让您确定 http 请求发生了什么。 r.data 将包含来自 API 的实际响应，假设请求成功。

app.factory("PagedDataService", ['$http', '$q', function($http, $q) {
   var data = [];
   var deferred;

   function GetPageRecursive(pageNumber) {
     var promise = $http.get('url', { page: pageNumber} ).then(function(r) {
        // add results to data here
        // also figure out if there's another page to get
        if(AnotherPage)
          GetPageRecursive(pageNumber ++)
        else
          deferred.resolve(data);
     })
     return promise;
   }

   return {
      GetData: function() {
        deferred = $q.defer();

        GetPageRecursive(1);

        return deferred.promise
      }

   }
}]);

【讨论】：

@user2128，试一试。它仍然不是完美的代码，但它应该为您指明正确的方向。 $q 和 promises 可能很棘手，但它们也是 angularjs 中一些更酷的东西。

【解决方案2】：

您可以在成功块中执行操作。例如，您可以将新数据添加到数组中。或者触发另一个服务器调用以获取下一页数据。这将允许您按顺序获取数据。

或者，您可以使用for 循环来触发 100 个 http 调用。不过这可能很慢。也许您只想在需要时获取数据？可能基于某些用户操作，例如滚动或按下按钮。

【讨论】：