zoukankan      html  css  js  c++  java
  • AngularJS分页插件

    1.
    angular.module('app',['mePagination'])
      .controller('myController',['$scope',function($scope){
        $scope.myPage={
          currentPage:1,//访问第几页数据,从1开始
          totalItems:0,//数据库中总共有多少条数据
          itemsPerPage: 30,//默认每页展示多少条数据,可更改
          pagesLength: 15,
          perPageOptions: [10, 20, 30, 40, 50,60]//可选择的每页展示多少条数据
        };

    //监测当页码。总数据,每页展示数据个数变化时,重新加载数据
        $scope.$watch(function ()
          return $scope.myPage.itemsPerPage+' '+$scope.myPage.currentPage+' '+ $scope.myPage.totalItems;
        },getList);

        function getList(){
        //获取列表需要时,将页码重置为1
          $scope.myPage.currentPage=myPage.pageNub;

        //传给服务器时,页码从0开始
        $http.get(host_name+url,{params:{"page":$scope.myPage.currentPage- 1,"limit":$scope.myPage.itemsPerPage,'}})
      .    success(function(d){
            $scope.list= d.data.result;
            $scope.myPage.totalItems=d.data.total;//当获取总数据后,修改默认值

          }).error(function(){
            console.log('error...');
          })
        }

      }])

    在页面中引入自己的css与js文件:

    <link rel="stylesheet" href="my-pagination.css"/>
    <script type="text/javascript" src="my-pagination.js"></script>


    <div ng-if="myPage.totalItems" my-pagination pg="myPage"></div>

    pg属性不能改,双向数据绑定的

    下载地址:http://pan.baidu.com/s/1slb65TN

  • 相关阅读:
    census 安全处理模式
    基于squid 暴露k8s 服务
    nginx 动态模块问题
    juicefs 多s3 bucket 使用
    k8s 数据卷需要很长时间才能挂载成功
    一种基于s3 管理haproxy 配置的模式
    WebSub 互联网分布式\订阅标准
    maven 多模块父模块问题deploy 问题
    nginx 作为s3 的gateway
    juicefs 单机试用
  • 原文地址:https://www.cnblogs.com/zshome/p/5811591.html
Copyright © 2011-2022 走看看