AnglarJS(二)分页插件使用

1.引入分页js，css插件

1）在js中引入

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

<script src="../plugins/angularjs/pagination.js">script>

2)在模块中引入插件

//控制器模块儿
    var app = angular.module('pyg', [ 'pagination' ]);

2、引入AnglarJS分页控件

1）在在控制器下引入分页插件控制器

//1）在在控制器下引入分页插件控制器
//分页控件配置
                $scope.paginationConf = {
                    currentPage : 1,
                    totalItems : 10,
                    itemsPerPage : 10,
                    perPageOptions : [ 10, 20, 30, 40, 50 ],
                    onChange : function() {
                        $scope.reloadList();//重新加载
                    }
                };

2）在页面body中引入分页插件视图

            <tm-pagination conf="paginationConf">tm-pagination>

3、定义刷新方法，该方法会在数据发生变化时自动加载

                //刷新页面
                $scope.reloadList = function() {

                    $scope.findPage($scope.paginationConf.currentPage,
                            $scope.paginationConf.itemsPerPage)

                };

4、定义分页查询方法

                //分页查询
                $scope.findPage = function(page, rows) {

                    var url = "/brand/findPage?page=" + page
                            + "&rows=" + rows;
                    $http.post(url).success(function(data) {
                        $scope.entitys = data.rows;
                        $scope.paginationConf.totalItems = data.total;
                    })

                };