Question

我正在尝试设计一种方法来将大量数据（超过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，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进行过滤也会出现明显的延迟，直到结果缩小为止。另一方面，几百行工作得相当好，并允许本机过滤 - 这是我实现的关键目标。

Answer 1

如果你想单独对待每一个（单独展示每一个），你就不能真正$ q.all承诺（这使它们成为一个成功或失败的重大承诺）。

一旦你得到它们，我会把你得到的东西推回到范围内。以下是一个例子：

    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/

此处存在一个问题，即项目的顺序取决于退货的时间，而不是原始请求订单。我会让你自己想出那个。

使用AngularJS加载大型数据集

1 个答案: