Angularjs 的 ngInfiniteScroll 的使用方法
一、介绍
ngInfiniteScroll 是一个 AngularJS 的扩展指令，实现了网页的无限滚动的功能，也就是相当于页面滚动到最底部的时候自动加载更多内容。
二、使用方法
-
引入js库
1 <script type='text/javascript' src='path/jquery.min.js'></script> 2 <script type='text/javascript' src='path/angular.min.js'></script> 3 <script type='text/javascript' src='path/ng-infinite-scroll.min.js'></script>
-
加载模块
1 angular.module('myApplication', ['infinite-scroll']); -
定义要实现滚动的元素
1 <div infinite-scroll="vm.nextPage()" infinite-scroll-disabled="vm.busy" infinite-scroll-distance="3"></div>然后自己去实现nextPage()方法既可以。
三、指令解释：
-
infinite-scroll:
是主要加载数据用的，也就是说，当你下拉到底部的时候就会触发这个方法去加载数据。 -
infinite-scroll-disabled:
这个值默认是false(Boolean类型), 默认关闭 “停止滚动” 这个功能.
当值为true的时候，infinite-scroll=”vm.nextPage()”中的vm.nextPage()方法将不会被调用。
翻页到底部的时候需要给一个 infinite-scroll-disabled=’{{scroll_switch}}’ 变量改变 disable的值。 -
infinite-scroll-distance:
这个值意思大致就是间隔多少页，比如说：如果该值为“0”的话，那么，当页面滚动到底部的时候才开始去加载数据。
如果该值为“1”的话，那么，当页面滚动到离底部还剩“1”页的时候，它就会去加载了。当然第一次访问页面的时候（还没开始滚动内容），它会先加载两页内容。
参考：
https://github.com/sroze/ngInfiniteScroll
http://www.oschina.net/p/nginfinitescroll
https://www.douban.com/note/331741944/
如有侵权，请告知。
Email: jamkong@126.com
