angularjs的前端使用

 第一步导入:
<script src= "pagination.js"></script>

 第二步:在模块使用控制器中添如下代码:
 //分页查询
    //重新加载列表 数据
    $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/' + page + '/' + rows).success(
            function (response) {
                $scope.list = response.rows;
                $scope.paginationConf.totalItems = response.total;//更新总记录数
            }
        );
    }
})
 

第三步:循环显示数据

<tr ng-repeat="brand in list">
    <td><input type="checkbox"></td>
    <td>{{brand.id}}</td>
    <td>{{brand.name}}</td>
    <td>{{brand.firstChar}}</td>
</tr>

第四步:在页面分页的</table>下调用

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