从服务器端nodejs到angularjs获取有限的json响应

Question

我从node.js服务器得到这个json响应。

我使用angularjs ng-repeat函数在我的前端显示它。当响应包含数组中的对象超过 100000 个时，浏览器挂起

所以我想在数组响应中获取前三个对象，

但是我再次将此响应发送到服务器端，

所以我想发送所有数据。

我来自服务器端的 json 响应：

[ { 
  field5: 'Chennai',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996'},
{ 
  field5: 'Tamilnadu',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996' },
{ 
  field5: 'Tuticorin',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996' },
{ 
  field5: 'Japan',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996'},
{ 
  field5: 'China',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996' },
{ 
  field5: 'Canada',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996' },
{ 
  field5: 'Canada',
  field6: 'Asia',
  field7: '600091',
  field8: '10-10-1996'} ]

我的控制器.js ：

将服务器端数据获取到 angularjs：

$http({
   method: 'GET',
   url: '/api/getnewgroup'
}).then(function (response) {
   $scope.excels = response.data;
}, function (response) {
   window.location.href = '/';
});

我最后一个将数据从客户端发送到服务器的 api：

$scope.uploadLast = function () {
   var data = {
      excels: $scope.excels,
   };
   $http.post('/api/uploadlast', data).then(function (response) {
   }).catch(function (response) {
      alert(response.data);
      console.log(response);
   });
}

Answer 1

在你的ng-repeat中，你可以使用"limitTo"过滤器，如下所示：

ng-repeat="excel in excels | limitTo:3"

这将仅显示数组的前 3 个条目。

如果要为显示的项目使用另一个数组，可以尝试：

$http({
    method: 'GET',
    url: '/api/getnewgroup'
}).then(function (response) {
    $scope.excels = response.data.slice(0, 3);
    $scope.remainingExcels = response.data.slice(3);
}, function (response) {
    window.location.href = '/';
});

和

$scope.uploadLast = function () {
    var data = {
        excels: $scope.excels.concat($scope.remainingExcels),
    };
    $http.post('/api/uploadlast', data).then(function (response) {
    }).catch(function (response) {
        alert(response.data);
        console.log(response);
    });
}

但这是一件非常"丑陋"的事情。