【问题标题】:AngularJS + Parse REST API - Paging through more than 1,000 resultsAngularJS + Parse REST API - 对超过 1,000 个结果进行分页
【发布时间】:2015-03-11 12:42:23
【问题描述】:

我正在使用 Parse REST API + AngularJS,并且我试图能够在每个查询中获得 1000 多个项目。我尝试开发一个递归函数并连接每个查询,直到获得所有数据。我的问题是我无法成功连接 JSON 对象。这是我所拥有的:

    $scope.getAllItems = function(queryLimit, querySkip, query) {
        $http({method : 'GET',
            url : 'https://api.parse.com/1/classes/myClass', 
            headers: { 'X-Parse-Application-Id':'XXX','X-Parse-REST-API-Key':'YYY'},
            params: {limit:queryLimit, skip:querySkip},

        }).success(function(data, status) {
                query.concat(data.results); 
                if(query.lenth == queryLimit) {
                    querySkip += queryLimit;
                    queryLimit += 100;
                    $scope.getAllItems(queryLimit, querySkip, query);
                } else {
                    $scope.clients = query;
                }

            })
            .error(function(data, status) {
                alert("Error");
            });
    };
    var myQuery = angular.toJson([]); //Am I creating an empty JSON Obj?
    $scope.getAllItems(100,0, myQuery);

有没有更好的解决方案来实现这一点?

【问题讨论】:

  • 每个服务器响应都是一个完整的json字符串或者不完整的json字符串,必须在多个查询中下载?
  • 如果每个服务器响应是一些对象的 json 编码数组,那么您可以创建空数组并为每个成功的请求添加下载的项目到这个数组。
  • 我的理解是一个完整的 JSON 字符串,Parse API 不会让你每次查询得到超过 1000 项,所以基本上我会得到前 1000 项作为结果。
  • 好的。只需创建数组并在每个请求上添加项目;-)
  • 您正在使用字符串播种 myQuery - 我认为您只需要 var myQuery = [];

标签: json angularjs rest parse-platform


【解决方案1】:

可能有更好、更简洁的想法,但这是我为自己制定的。

为我服务...

fetch : function(page, perpage) {
    var query = // build the query
    // the whole answer to your question might be this line:
    query.limit(perpage).skip(page*perpage);
    return query.find();
},

fetchCount : function() {
    var query = // build the same query as above
    return query.count();
},

在控制器中...

$scope.page = 0;       // the page we're on
$scope.perpage = 30;   // objects per page

MyService.fetchCount().then(function(count) {
    var pagesCount = Math.ceil(count / $scope.perpage);
    $scope.pages = [];
    // pages is just an array of ints to give the view page number buttons
    for (var i=0; i<pagesCount; i++) { $scope.pages.push(i); }
    fetch();
});

function fetch() {
    return MyService.fetch($scope.page, $scope.perpage)).then(function(results) {
        $scope.results = results;
    });
}

// functions to do page navigation
$scope.nextPage = function() {
    $scope.page += 1;
    fetch();
};

$scope.prevPage = function() {
    $scope.page -= 1;
    fetch();
};

$scope.selectedPage = function(p) {
    $scope.page = p;
    fetch();
};

然后在我的视图中分页按钮和结果(bootstrap.css)...

<ul class="pagination">
    <li ng-click="prevPage()" ng-class="(page==0)? 'disabled' : ''"><a>«</a></li>
    <li ng-repeat="p in pages" ng-click="selectedPage(p)" ng-class="(page==$index)? 'active' : ''"><a>{{p+1}}</a></li>
    <li ng-click="nextPage()" ng-class="(page>=pages.length-1)? 'disabled' : ''"><a>»</a></li>
</ul>

<ul><li ng-repeat="result in results"> ... </li></ul>

【讨论】:

  • 感谢您分享您的解决方案。
【解决方案2】:

我修复了我的递归函数,现在它可以工作了。这里是:

$scope.getAllItems = function(queryLimit, querySkip, query, first) {

        $http({method : 'GET',
            url : 'https://api.parse.com/1/classes/myClass', 
            headers: { 'X-Parse-Application-Id':'XXX','X-Parse-REST-API-Key':'YYY'},
            params: {limit:queryLimit, skip:querySkip},

        }).success(function(data, status) {
                if(first) {
                    query = data.results;
                    first = !first;
                    if(query.length == queryLimit) {
                        querySkip += queryLimit;
                        $scope.getAllItems(queryLimit, querySkip, query, first);
                    } else {
                        $scope.clients = query;
                    }
                } else {
                    var newQ = data.results;
                    for (var i = 0 ; i < newQ.length ; i++) {
                      query.push(newQ[i]);
                    }
                    if(query.length == queryLimit + querySkip) {
                        querySkip += queryLimit;
                        $scope.getAllItems(queryLimit, querySkip, query, first);
                    } else {
                        $scope.clients = query;
                    }
                }
            })
            .error(function(data, status) {
                alert("Error");
            });
    };

只需将每个元素推送到我的空数组中,我也在变异 queryLimit 而不是 querySkip 以遍历所有元素。

【讨论】:

  • 嗨。我可以知道 angularjs 是否能够毫无问题地解析 1000 多条记录吗?
猜你喜欢
  • 2013-04-25
  • 1970-01-01
  • 1970-01-01
  • 2019-07-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-10-31
  • 1970-01-01
相关资源
最近更新 更多