angular的分页代码示例
来源:互联网 发布:解放军纪律知乎 编辑:程序博客网 时间:2024/05/18 03:56
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="http://www.w3cschool.cc/try/angularjs/1.2.5/angular.min.js"></script>
<script src="http://cdn.bootcss.com/angular-ui-bootstrap/0.11.2/ui-bootstrap-tpls.js"></script>
</head>
<body ng-app="myApp" style="background:#4A4A4A; overflow:hidden;" class="row" >
<div style="color:#fff; font-size:30px; font-weight:bold; text-shadow:3px 3px 3px #ccc;-webkit-text-shadow:3px 3px 3px #ccc; text-align:center; margin-top:30px;"></div>
<div class="row">
<div ng-controller="pageDemo" class="col-md-6" style="margin:40px auto; float:none; background:#fff; padding:30px;">
<h4>默认:</h4>
<pagination boundary-links="true" total-items="totalItems" ng-model="currentPage" max-size = "maxSize" items-per-page="numPages" class="pagination-sm" previous-text="‹" next-text="›" first-text="«" last-text="»" ng-change="select()">
</pagination>
其它属性:rotate = "false/true" ,direction-links="true/false"等等,
</div>
</div>
</body>
<script>
angular.module('myApp',['ui.bootstrap']).controller('pageDemo',function($scope){
$scope.maxSize = 7; //一个页面显示7页
$scope.totalItems = 180; //总共多少条数据
$scope.currentPage = 1; //文档加载后显示在第一页
$scope.numPages = 18; //每页存放多少条数据
$scope.select = function(){ //一般用于点击那一页后调用接口
alert($scope.currentPage);
}
})
</script>
</html>
哪儿做的不对的地方希望大家指出,http://www.cnblogs.com/woleicom/p/5632687.html具体请看高手写的
0 0
- angular的分页代码示例
- 一段简单的php分页代码示例
- 超强的分页查询、排序示例代码
- PHP分页技术的代码和示例
- PHP分页技术的代码和示例
- PHP分页技术的代码和示例
- PHP分页技术的代码和示例
- 分页代码示例
- JS分页代码示例
- Angular JS 的分页功能
- gv,Repeater分页示例代码
- php分页函数示例代码
- php+mysql分页代码示例
- 适用于Jsp的通用分页程序(示例代码)
- 分页取数存入数组的一段示例代码
- 用smarty实现简单分页的示例完整代码
- angular分页
- Angular开发(二十八)-angular开发中分页的使用
- 多进程下的单实例和全局变量
- java实现愤怒的小鸟游戏之Java swing图形界面开发游戏项目愤怒的小鸟源码及实现方式详解
- JZOJ1422. 猴子摘桃
- 人月神话读书笔记(2)----人月神话
- Zynq VDMA 自测
- angular的分页代码示例
- zz Specified VM install not found: type Standard VM
- 刚开始添加Open CV的时候遇到问题
- 权值共享和卷积核(滤波器)
- 如何让file input能够实现置空和【异步】上传后相同文件的再次选择触发change
- 代理
- Android绘图基础3
- JAVA自学之每日一题(十)
- Hibernate主键生成方式 Key Generator