1、 表格部分  

2、 分页工具条部分  

3、 使用 Angular 动态加载数据，显示动态数据表格  

4、 基于 Angular 实现分页工具条功能   

流程分析 ：

1） 客户端发送给服务器 两个参数 ： 当前页码， 每页记录条数

2） 服务器端 根据当前页码和每页记录条数 查询结果返回： 总记录数，当前页数据

3） 客户端将返回当前页数据显示到表格中，根据返回总记录和每页记录条数，计算总页数，根据总页数和当前页码，显示分页工具条 （百度 默认显示 10 个页码，当前页居中 ）

在工具条上，将静态数据换为动态数据，绑定点击事件  

         prev() 加载上一页数据显示           next() 加载下一页数据显示           selectPage(page) 加载指定页数据显示           isActivePage(page) 判断是否为当前显示页码   将显示所有页码，加入 pageList 集合对象，遍历显示出来  

服务器返回数据格式 修改 6_1.json  

分页工具条显示 10 个页码代码分析  

 

file:///C:\Users\ADMINI~1\AppData\Local\Temp\ksohtml13828\wps41.png