<ion-content>
<ion-list>
<ion-item ng-repeat="item in items track by $index">
<p>{{item}}</p>
</ion-item>
<ion-infinite-scroll on-infinite="addItems()"></ion-infinite-scroll>
</ion-list>
</ion-content>

controller

     $scope.items = [];
for (var i=0; i<100; i++) {
$scope.items.push(i);
}
$scope.addItems = function() {
var i = currentStart = 0;
for (; i < currentStart+20; i++) {
$scope.items.push("Item " + i);
} currentStart += 20;
$scope.$broadcast('scroll.infiniteScrollComplete');
};

ionic ion-list 滑到底部自动加载数据案例的更多相关文章

  1. Layman H5+Webapp+MUI App 页面滑至到底部自动加载新的内容

    要点:使用jquery的scroll()方法实现,当用户滚动指定的元素时,会发生 scroll 事件 scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口) scroll() 方 ...

  2. 当滚动条滚动到页面底部自动加载增加内容的js代码

    这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...

  3. UWP-ListView到底部自动加载更多数据

    原文:UWP-ListView到底部自动加载更多数据 ListView绑定的数据当需要“更多”时自动加载 ListView划到底部后,绑定的ObservableCollection列表数据需要加载的更 ...

  4. 分享大麦UWP版本开发历程-03.GridView或ListView 滚动底部自动加载后续数据

    今天跟大家分享的是大麦UWP客户端,在分类.订单或是搜索时都用到的一个小技巧,技术粗糙大神勿喷. 以大麦分类举例,默认打开的时候,会为用户展示20条数据,当用户滚动鼠标或者使用手势将列表滑动到倒数第二 ...

  5. sencha treestore 取消自动加载数据

    gridstore在设置了autoLoad=false后不会自动加载数据,但是treestore不行,后来发现删掉root里的expanded:true后就可以了.但是界面上树没有展开,需在store ...

  6. AngularJS 实现页面滚动到底自动加载数据的功能

    要实现这个功能,可以通过https://github.com/sroze/ngInfiniteScroll这个第三方控件来实现.步骤如下: 1. 下载ng-infinite-scroll.js程序ht ...

  7. AngularJS:实现页面滚动到底自动加载数据的功能

    要实现这个功能,可以通过https://github.com/sroze/ngInfiniteScroll这个第三方控件来实现.步骤如下: 1. 下载ng-infinite-scroll.js程序ht ...

  8. jquery 页面滚动到底部自动加载插件集合

    很多社交网站都使用无限滚动的翻页技术来提高用户体验,当你页面滑到列表底部时候无需点击就自动加载更多的内容.下面为你推荐 10 个 jQuery 的无限滚动的插件: 1. jQuery ScrollPa ...

  9. Jquery鼠标滚动到页面底部自动加载更多内容,使用分页

    index.php代码   [html] view plaincopy <!DOCTYPE html PUBLIC ;}                .single_item{padding: ...

随机推荐

  1. Java中Websocket使用实例解读

    介绍 现在很多网站为了实现即时通讯,所用的技术都是轮询(polling).轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP request,然后由服务器返回最新的数据给客服端的浏览器 ...

  2. B - The Accomodation of Students - hdu 2444(最大匹配)

    题意:现在有一些学生给你一下朋友关系(不遵守朋友的朋友也是朋友),先确认能不能把这些人分成两组(组内的人要相互不认识),不能分的话输出No(小写的‘o’ - -,写成了大写的WA一次),能分的话,在求 ...

  3. jQuery.holdReady()方法用法实例

    调用此方法可以延迟jQuery的ready事件,也就是说尽管文档已经加载完成,也不会执行ready事件处理方法.可以多次调用jQuery.holdReady()方法,以延迟jQuery的ready事件 ...

  4. nav标签的作用

    . <nav>用来将具有导航性质的链接划分在一起,使代码结构在语义化方面更加准确,同时对于屏幕阅读器等设备的支持也更好.一直以来,我们习惯于使用形如<div id="nav ...

  5. CodeForces 371D. Vessels

    暴力+胡乱优化就过了..tags给的东西似乎什么都没用到.....CF的数据是不是有点水啊.....果然是没有营养的题目..... D. Vessels time limit per test 2 s ...

  6. 在JAVA中 System.getProperty 和 System.setProperty 方法.

    今天着手研究TOMCAT源码. 在刚開始的时候Startup类中init方法中调用非常多次System.getProperty和System.setProperty的方法. 后来经过网上搜索才得知,这 ...

  7. Laravel 4 Quick Tip: Custom Error Pages

    App::error(function($exception, $code) { switch ($code) { case 403: return Response::view('errors.40 ...

  8. 阻塞机制下的recv小结

    recv是socket编程中最常用的函数之一,在阻塞状态的recv有时候会返回不同的值,而对于错误值也有相应的错误码,分别对应不同的状态,下面是我针对常见的几种网络状态的简单总结.      首先阻塞 ...

  9. 字典与集合(Dictionary与Collection)

    Dictionary对象将替换Collection对象,并提供附加的语言从而使增加和删除记录的速度比以前提高三倍 虽然Visual Basic 6.0只有很少的新特点,但是具有某些功能强大的新的对象模 ...

  10. Vs2010发布Asp.Net网站及挂到IIS服务上

    首先用vs2010打开一个Asp.Net项目, 也可以通过vs菜单->生成->发布网站                           选择发布网站的路径 这样发布就OK了 下面就吧发 ...