We often use paging to display data when we do projects. The principle is very simple: each time we click (next / last) a page, we send a request to the background to obtain relevant JSON data. What I'm demonstrating here is that every time I request, I will pass two parameters (pageSize – data to be displayed on each page, pageNo – current page number) to the background ), this article shares the relevant contents;
HTML related code:

<div id='demo' ng-app='myApp' ng-controller='myCtrl'>
        <table>
            <thead>
                <th>Serial number</th>
                <th>Operator</th>
                <th>category</th>
                <th>Telephone</th>
                <th>Amount of money</th>
                <th>Operation time</th>
            </thead>
            <tbody>
            <tr ng-repeat="item in items">
                <td>{{$index+1}}</td>
                <td>{{item.operator}}</td>
                <td>{{item.type}}</td>
                <td>{{item.tell}}</td>
                <td>{{item.price}}</td>
                <td>{{item.operateTime}}</td>
            </tr>
            </tbody>
        </table>
        <div class="page">
            <span class="nextPage" ng-click="nextPage()">next page</span>
            <span class="prevPage" ng-click="lastPage()">Previous page</span>
            <span>{{cur}}/{{totalPage}} Page sharing {{totalNum}} Bar record</span>
        </div>
    </div>

CSS code will not be pasted up, and we will supplement it by ourselves;
JS Code:

var params={
        pageSize:10,
        pageNo:1
    }；
var curPage=1;
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope,$http) {
   init($scope,$http);
})

function search($http,$scope){
            params.pageNo=pageNo;
            $http({
                method: 'GET',
                url:Background interface address,
                params:params
            }).then(function successCallback(response) {
                // Total number of data
                $scope.totalNum = response.data.totalNum;
                // Total pages of data
                $scope.totalPage = response.data.totalPage;
                // Data current page
                $scope.cur = curPage;
                // List details
                var content = response.data.contents;
                for(var i in content){
                    // Data operator
                    content[i].operator= content[i].operator;
                    // Data phone
                    content[i].tell= content[i].tell;
                    // Data class
                    content[i].type = content[i].type;
                    // Data operation time
                    content[i].operateTime = content[i].createTime;
                    // Data price
                    content[i].price = content[i].price;
                }
                $scope.items = content;
            }, function errorCallback(response) {
                // Request failed execution code
                if(response!=null)
                    error(response)
            });
        }
function init($scope,$http){
        search($http,$scope);
        $scope.nextPage=function(){
            nextPage($http,$scope);
        };
        $scope.lastPage=function(){
            lastPage($http,$scope);
        };
    }
// Click previous
function lastPage($http,$scope){
    if(curPage>1){
        curPage--;
        search($http,$scope);
    }
}
// Click Next
function nextPage($http,$scope){
    if(curPage<totalPage){
        curPage++;
        search($http,$scope);
    }
 }

**Be careful**
//If you delete a piece of data according to the serial number in front of the data in your project, it is recommended to read this blog [Angular Js$indexCareful use of](http://blog.csdn.net/renfufei/article/details/43061877)