• anglarJs分页


    首先在页面引入分页插件

    <script src="../plugins/angularjs/pagination.js"></script>
    <link rel="stylesheet" href="../plugins/angularjs/pagination.css">

    然后再挂载到模块上:

    var app=angular.module('app',['pagination']);

    在表格最底下加入:

    <!-- 分页 -->
    <tm-pagination conf="paginationConf"></tm-pagination>

    这样就完成了,需要配置paginationConf,以及相关js

    /重新加载列表 数据
    $scope.reloadList=function(){
    //切换页码
    $scope.findPage( $scope.paginationConf.currentPage,
    $scope.paginationConf.itemsPerPage);
    }
    //分页控件配置
    $scope.paginationConf = {
    currentPage: 1,
    totalItems: 10,
    itemsPerPage: 10,
    perPageOptions: [10, 20, 30, 40, 50],
    onChange: function(){
    $scope.reloadList();//重新加载
    }
    };
    //分页
    $scope.findPage=function(page,rows){
    $http.get('../brand/findPage.do?page='+page+'&rows='+rows).success(
    function(response){
    $scope.list=response.rows; 
    $scope.paginationConf.totalItems=response.total;//更新总记录数
    } 
    );
    }

    paginationConf 变量各属性的意义:
    currentPage:当前页码
    totalItems:总条数
    itemsPerPage:
    perPageOptions:页码选项
    onChange:更改页面时触发事件

  • 相关阅读:
    ASP.NET面试题2
    [转]深入.NET DataTable
    C#操作Excel (转)
    XML操作大全
    j2sdk 好用了
    我对“重构(refector)”的看法
    成功执行
    java属性类(Properties类)
    Sharpdevelop下载
    POJ 1753 Flip Game(翻转棋盘+枚举+dfs)
  • 原文地址:https://www.cnblogs.com/xiufengchen/p/10368888.html
Copyright © 2020-2023  润新知