Menampilkan daftar item adalah tugas umum untuk sebagian besar aplikasi web. Biasanya, data kami akan relatif besar dan tidak dapat ditampilkan dengan baik dalam satu halaman. Dalam hal ini, kita perlu menampilkan data dalam formulir halaman, dengan fungsi pergi ke halaman sebelumnya dan halaman berikutnya. Sekarang saya belajar Angular, menggunakan pagination AngularJS, berdasarkan implementasi arahan, dan menggunakan bootstrap dalam gaya, dan langsung menambahkan tag ke kode HTML untuk menyebutnya.
Mari kita lihat rendering terlebih dahulu
Kode contoh
app.directive ('pagepagination', function () {return {batasi: 'e', template: '<verv> <ul> <li ng-class = "page.style" ng-repeat = "halaman di pagelist"> <a href = "{{{page.link}}}"> {{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{ ng-if = "pagelist [0]"> <li> <span> Total <b> {{pagerecord}} </b> catatan/total <b> {{pagecount}} </b> halaman </span> </li> "pager", ":": ":": "", "", "", "", "", "" " "," PageUrlTemplate ":" = "}, controller: ['$ scope', function ($ scope) {$ scope.getLink = function (pageid) {return $ scope.pageurltemplate.replace (" {page} ", pageid); $ scope.pageid - 1) / $ scope._pagesize) * $ scope._pagesize + 1; "", tautan: $ scope.getLink (1)}); untuk (var pageid = firstPage; pageid <firstPage +10; pageid ++) {if (pageid> = 1 && pageid <= $ scope.pagecount) {page.push ({name: pageid, tautan: $ scope.pagecount) "page.push ({name: pageid, tautan: $ scope.pagecount)" page.push ({name: pageid, tautan: $ scope.pagecount) "page.push ({name: pageid, $: $ scope.pagecount (" page.push ({name: pageid, $: $ scope.pagecount ("page.push ({name: pageid, $: $ scope.pagecount)" page) });}} page.push ({name: 'Next Page', Style: $ scope.pageid == $ scope.pagecount? "Disabled": ", tautan: $ scope.getLink ($ scope.pagecount)}); : scope.getLink ($ scope.pagecount)}); !! SCOPE.PAGEISE) {$ scope._pagesize = parseInt ($ scope.pagesize); $ scope.pageid <1) {$ scope.pageid = 1; $ scope.pageInit ();}]}});Kode panggilan:
<page-pagination page-id = "pageid" page-record = "recordcount" page-url-template = "urltemplate"> </page-pagination>
Di atas adalah seluruh konten Kode Paginasi Angular.js. Saya berharap ini akan membantu untuk pembelajaran semua orang, dan saya harap semua orang akan lebih mendukung wulin.com.