序

在学习任何语言之前，必须有业务需求来驱动你去学习它。当然，ng也不例外。在学习ng之前，我想做的第一个演示就是实现基于ng的分页。除了基本的计算思路，就是把指令打包成一个插件，在需要分页的列表页面中直接引用。

插件组件

当我打包分页插件时，我意识到几个方法通常是分散的。最后找到了一个朋友打包的插件(http://www .缪月月.com/archives/813.html)，还不错。看完他的源代码，我直接在项目中使用。

使用原则和说明。

1.该插件源代码主要基于angular指令。

2.调用时的关键点是后台请求处理函数，即从后台取数据。

3.该插件有两个关键参数：currentPage、itemsPerPage、当前页码和每页记录数。

4.调用实现方法后，每次点击分页插件的页码，都需要重新提交后台，获取对应的页码数据。在被叫的页码里，我用$watch来监控。第一次使用的时候，我把调用函数放在插件的onchange里，发现每次都会触发两次后台。这个地方需要注意。

5.我将请求背景封装到一个Service层，然后在Controller中调用它，这也符合MVC。

翻译

调用代码

div ng-app=' DeMoapp ' ng-controller=' DeMocontroller ' table class=' table-striped ' the DTR did/TDTfirst name/TDTlastname/TDTdStatus/TDTdAddress/TD/tr/thead body tr ng-repeat=' EMP in persons ' TD { { EMP。ID}}/tdtd{{emp。FirstName}}/tdtd{{emp。LastName}}/tdtd{{emp。Status}}/tdtd{{emp。address } }/TD/tr/t body/tabletm-pagination conf=' pagination conf '/TM-pagination/div script type=' text/JavaScript ' var app=angular . module(' Demoapp '，[' TM . pagination '])；app.controller('DemoController '，['$scope '，' BusinessService '，function ($scope，business service){ var getallemploye=function(){ var post data={ page index : $ scope . paginationconf . current page，pagesize : $ scope . paginationconf . items perpage } business service . list(post data)。success(function(response){ $ scope . pagination conf . totalitems=response . count；$ scope . persons=response . items；});}//配置基本分页参数$ scope . pagination conf={ currentpage 3360 1，items perpage 3360 5 }；/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *作用域。$ watch(' pagination conf . current page pagination conf . items perpage '，GetalLemployee)；}]);//business class app . factory(' business service '，['$ http '，function($ http){ var list=function(post data){ return $ http . post('/employee/getallemployee '，post data)；}返回{list:函数(PostDATa){ return list(PostDATa)}；}}}]);/script以上内容是边肖介绍的基于Angularjs实现分页功能的示例代码，希望对大家有所帮助！