我正在尝试设计一种方法来将大量数据(超过1000行)加载到页面中,而不需要分页.这方面的第一个障碍是以并行的大小块查询数据库,我在
How to make sequentially Rest webservices calls with AngularJS?的解决方案的帮助下完成了
然而,我遇到了两个问题：
>每个返回的对象都被传递到一个数组中,然后该数组本身作为Angular用于绑定的数组返回.即[[{key：value,key：value,key：value},{key：value,key：value}],[{key：value,{key： value,key：value}]]因此我不能使用ng-repeat =“item in data”,因为data是一个数组数组.执行“数据[0]中的项目”确实使项目可用.连接似乎是答案,但我无法找到一种方法使其工作.
>我正在向数据库发出多个请求,并且每个请求都会正确返回,但是在所有请求都完成之前页面才会呈现 – 这完全否定了首先执行多个请求的要点.
所以查看我的代码,如何重新编写它来解决这两个问题呢？那么数据作为一个数组返回,并且每次查询完成时都会呈现数据？
app.factory('ScanService',function($http,$q) {
function fetchOne(stepCount) {
return $http({
method: 'GET',url: '/index.PHP/scans',params: {step:stepCount}
})
.then(function onSuccess(response) {
return response.data;
}
return {
fetchAll: function(steps) {
var scans = [];
for (var i = 1; i <= steps; i++) {
scans.push(fetchOne(i));
}
return $q.all(scans);
}
};
});
app.controller.ScanCtrl = function($scope,$q,ScanService) {
$scope.scans = ScanService.fetchAll(10);
};
跟进
我应该补充说,我确实根据下面的解决方案和angular.forEach()设法使其工作.不能建议任何使用“大数据”的人走这条路.大约1000行,浏览器不堪重负,并开始大幅减速.尝试使用angular.filter进行过滤也会出现明显的延迟,直到结果缩小为止.另一方面,几百行工作得相当好,并允许本机过滤 – 这是我实现的关键目标.
如果你想单独处理每一个(单独显示每一个),你就不能真正地将这些承诺放在一起(这使得它们成为一个成功或失败的重大承诺).
一旦你得到它们,我会把你得到的东西推回到范围内.以下是一个例子：
function MyCtrl($scope,$timeout,$q) {
var fetchOne = function() {
var deferred = $q.defer();
$timeout(function() {
deferred.resolve([random(),random() + 100,random() + 200]);
},random() * 5000);
return deferred.promise;
};
$scope.scans = [];
for (var i = 0; i < 2; i++) {
fetchOne().then(function(items) {
angular.forEach(items,function(item) {
$scope.scans.push(item);
});
});
};
}
这是一个小提琴,显示它在行动：http://jsfiddle.net/wWcvx/1/
这里存在一个问题,即项目的顺序取决于它们何时被退回,而不是基于您的原始请求订单.我会让你自己想出那一个.
