AngularJS 无限滚动加载数据控件 ngInfiniteScroll
屠浩
[color=red][size=x-large]在开发中我们可能会遇到滚动鼠标到浏览器底部实现数据的加载，js和jquery实现都不复杂都是既然AngularJS提供现成的我们怎么不用昵。[/size][/color]
[size=x-large]ng-infinite-scroll.js这个组件则可以实现：[/size]
[size=x-large]ng-infinite-scroll.js:下载地址：http://sroze.github.io/ngInfiniteScroll/[/size]
[color=olive][size=x-large]使用：[/size][/color]
[size=x-large]ng-infinite-scroll.js这个组件则可以实现：[/size]
[size=x-large]ng-infinite-scroll.js:下载地址：http://sroze.github.io/ngInfiniteScroll/[/size]
[color=olive][size=x-large]使用：[/size][/color]
<!DOCTYPE html>
<html ng-app="lxApp" ng-controller="lxCtrl">
<head>
<title>柳絮飞祭奠</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<div style="height: 700px;"></div>
<div infinite-scroll="mouse_scroller()">
<div ng-repeat="item in show"></div>
</div>
</body>
<script type="text/javascript" src="../plugins/angular/angular.js"></script>
<script type="text/javascript" src="../plugins/angular/ng-infinite-scroll.js"></script>
<script type="text/javascript">
var lxApp=angular.module("lxApp",['infinite-scroll']);
lxApp.controller("lxCtrl",function($scope){
$scope.mouse_scroller=function(){
//每次滚动到浏览器底部都会触发这个方法这里写你的加载数据业务。
};
});
</script>
</html>
类似资料：