<div>
<button class="btn btn-info" type="button" ng-click="setPage(3)">Set current page to: 3</button>
<h6><code>rotate</code> defaulted to <code>true</code> and <code>force-ellipses</code> set to <code>true</code>:</h6>
<uib-pagination class="pagination-sm" 分页函数="" ng-change="pageChanged()" 是否将当前页显示在中间="" rotate="true" 是否显示首页,和末页的数字="" boundary-link-numbers="true" 是否显示“.....”这几个点="" force-ellipses="true" 显示页码的页码tabs数量(不包含首页,末页)="" max-size="maxSize" 当前页="" ng-model="bigCurrentPage" 每页显示的数据条数="" ="" items-per-page="pageSize" 总的数据记录数="" total-items="bigTotalItems" =""> </uib-pagination>
<pre>Page: {{bigCurrentPage}}/{{numPages}}</pre>
</div>
define(['app'],function(myapp){
myapp.directive("pagedir",[function(){
return{
templateUrl:"js/directives/pagedir/pagedir.html",//指令的模板页面
restrict:'AE',
scope:{
data:'=', //用于获取页面控制器传回来的数据(例如:总得记录数,每页显示的数量等....)
currentpage:'=', //返回当前页给页面控制器
},
link:function(s,el,attrs){
},
controller:['$scope','$log',function($scope,$log){
$scope.bigTotalItems=$scope.data.bigTotalItems;
$scope.pageSize=$scope.data.pageSize;
$scope.bigCurrentPage=$scope.data.bigCurrentPage;
$scope.numPages=$scope.data.numPages;
$scope.maxSize=$scope.data.maxSize;
$scope.setPage = function (pageNo) {//用于设置回到指定页
$scope.bigCurrentPage = pageNo;
console.log( $scope.bigCurrentPage);
};
$scope.pageChanged = function() {//用于返回当前页
$log.log('Page changed to: ' + $scope.bigCurrentPage);
console.log($scope.bigCurrentPage);
$scope.currentpage=$scope.bigCurrentPage;//赋值,准备传给页面控制器,用于接口的取值
};
}],
}
}]);
});
<p>this is page dir</p> <pagedir ng-click="getCurPage()" currentpage="currentpage" data="dataPage"> </pagedir>
define(['app','directives/pagedir/pagedir'],function(myapp){
myapp.controller("idea_test_ctrl",['$scope',function($scope){
$scope.dataPage={ //用于分页的数据
maxSize:5, //显示五个页码按钮(不包括第一条,和最后一条)
bigTotalItems:50, //总的记录数(一般来源于接口的返回数据)
bigCurrentPage:1, //当前页码
pageSize:5, //每页显示的数据数量
numPages:50/5, //共有多少页
};
$scope.getCurPage=function(){
console.log($scope.currentpage,"========================================");
//接下来的调用后台接口,返回数据
//...........................一系列的后续操作
}
}]);
});
.state('home.ideas.test', {
url: '/test',
views: {
"part": {
templateUrl: 'tpls/ideas/test.html',
controller:"idea_test_ctrl"
}
}
})
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有