angularjs – 逐行加载图像的ng重复,角度js

发布时间：2020-12-17 08:13:53 所属栏目：安全来源：网络整理

导读：我希望你能帮忙，一直在互联网上寻找解决方案，找不到.. 当您向下滚动页面时，您是否知道如何实现逐行加载的内容？否则1000张图像将在同一时间加载。非常感谢。使用无限滚动指令。 ngInfiniteScroll DEMO HTML div ng-app='myApp' ng-controller='DemoCont

我希望你能帮忙，一直在互联网上寻找解决方案，找不到..

当您向下滚动页面时，您是否知道如何实现逐行加载的内容？否则1000张图像将在同一时间加载。

非常感谢。

使用无限滚动指令。 ngInfiniteScroll

DEMO

HTML

<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);
    }
  };
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!