用AngularJS处理数据库中的分页

Question

我正在尝试使用控制器中的'$http‘服务从一个自定义应用程序接口(带PostgresSQL数据库的flask)获取所有数据，但应用程序接口和数据库是用分页构建的，这意味着如果我不想访问数据，需要创建如下服务：

/*FIRST PAGE*/     
$http.get("/api/test", testData)
                .success(...)
/*SECOND PAGE*/
$http.get("/api/test?page=2", testData)
                .success(...)

这显然不是一个好的解决方案，但它是有效的！那么你能指导我如何更好地处理这种情况吗？因为我知道这个api包含1000多个页面...

干杯！

Answer 1

这是在official documentation中描述的。

Angular的$http服务支持config参数(.get的第二个参数)，它支持params参数，并通过适当的编码等为你做所有的连接。

params – {Object.<string|Object>} -将使用paramSerializer序列化并附加为GET参数的字符串或对象的映射。

所以你可以这样做

  angular
    .module('xxx')
    .factory('getPagedData', function ($http) {
      return function(page) {
        return $http.get("/api/test", { params: { page: page } });
      }
    });

并像这样使用它：

function someController(getPagedData) {
  getPagedData(2).then(...); // will do GET /api/test?page=2
}

还要注意，.success方法是deprecated。它甚至在Angular 1.6中被移除了。请改用.then。

Answer 2

虽然这似乎是一个合乎逻辑的解决方案...

/* SERVICE */
var baseUrl = "/api/test";

MyService.getTests = function(page, testData) {
  var pageParams = "";
  if (page > 1) {
    pageParams = "?page="+page;
  }
  return $http.get(baseUrl+pageParams, testData).success().error();
}

...GET请求不允许您发送任何数据。我不确定您计划如何向$http.get请求发送testData。配置请求的第二个参数是GET对象，它使您的服务变得更加简单。

var baseUrl = "/api/test";
MyService.getTests = function(page, testData) {
  return $http.get(baseUrl, {params: {page: page})  //becomes /api/test?page=1
  .success()
  .error();
}

Answer 3

每次想要翻页到下一个数据集时，只需传递一个变量即可。所以你会有：

$http.get("/api/test?page="+ pageNum, testData).success(..)

希望这能有所帮助！