Angular js - On向上滚动加载更多数据

Question

我开发了像Facebook这样的聊天系统。现在我想加载更早的消息。任何人都可以帮我做功能，就像我向上滚动它应该像Facebook一样加载早期的消息。

Answer 1

您可能需要查看ngInfiniteScroll。使用此模块，可以非常轻松地实现您想要的功能。这是一个例子：

<div ng-app='myApp' ng-controller='DemoController'>
  <div infinite-scroll='loadMore()' infinite-scroll-distance='2'>
    <img ng-repeat='image in images' ng-src='http://placehold.it/225x250&text={{image}}'>
  </div>
</div>

var myApp = angular.module('myApp', ['infinite-scroll']);
myApp.controller('DemoController', function($scope) {
  $scope.images = [1, 2, 3, 4, 5, 6, 7, 8];

  $scope.loadMore = function() {
    var last = $scope.images[$scope.images.length - 1];
    for(var i = 1; i <= 8; i++) {
      $scope.images.push(last + i);
    }
  };
});

如果您使用的是Bower，则可以使用bower install ngInfiniteScroll.

进行安装