Kata pengantar
Sebelum mempelajari bahasa apa pun, harus ada kebutuhan bisnis untuk mendorong Anda untuk mempelajarinya. Tentu saja, NG tidak terkecuali. Sebelum belajar NG, demo pertama yang ingin saya lakukan adalah menerapkan paging berdasarkan NG. Selain ide komputasi dasar, ini adalah menggunakan instruksi untuk merangkumnya ke dalam plug-in dan secara langsung merujuknya di halaman daftar yang membutuhkan paging.
Plugin
Ketika saya merangkum plugin paging, saya menerapkan beberapa metode secara umum, dan saya akhirnya menemukan plug-in yang dikemas oleh teman (http://www.miaoyueyue.com/archives/813.html). Saya merasa itu cukup bagus, jadi saya membaca kode sumbernya dan menggunakannya langsung di proyek.
Prinsip dan instruksi untuk digunakan
1. Kode sumber plug-in terutama diimplementasikan berdasarkan Petunjuk Angular.
2. Poin kunci saat menelepon adalah fungsi pemrosesan permintaan latar belakang, yaitu mendapatkan data dari latar belakang.
3. Plug-in memiliki dua parameter utama: SurrentPage, ItemsPerPage, Nomor Halaman Saat Ini dan Nomor Catatan per halaman.
4. Setelah menerapkan panggilan metode, kita perlu mengirimkan kembali latar belakang untuk mendapatkan data nomor halaman yang sesuai berdasarkan setiap klik pada nomor halaman plug-in paging. Di nomor halaman panggilan saya menggunakan $ watch untuk memantau. Ketika saya pertama kali menggunakannya, saya meletakkan fungsi panggilan di onchange plug-in, tetapi saya menemukan bahwa latar belakang akan dipicu dua kali setiap kali. Tempat ini membutuhkan perhatian.
5. Saya merangkum latar belakang permintaan menjadi lapisan layanan dan kemudian memanggilnya di pengontrol, yang juga sesuai dengan ide MVC.
Diagram reproduksi
Kode panggilan
<div ng-app="DemoApp" ng-controller="DemoController"><table><thead><tr><td>ID</td><td>FirstName</td><td>LastName</td><td>Status</td><td>Address</td></tr></thead><tbody><ttr ng-repeat="emp in orang "> <td> {{emp.id}} </td> <td> {{emp.firstname}} </td> <td> {{emp.lastname}} </td > <td> {{emp.Status}} </td> <td> {{emp.address}} </td> </tbody> </able> <tm-pagination conf = "paginationconf"> </tm-pagination> </div> <script type = "text/javascript"> var app = angular.module ('demoapp', ['tm.pagination']); app.controller ('function {varie (' $ scope ',' $ scope ',' $ scope ',' $ scope ',' $ scope ',' $ scope ',' $ scope ') PostData = {pageIndex: $ scope.paginationconf.currentpage, pageSize: $ scope.paginationconf.itemsperpage} bisnisservice.list (postdata) .success (function) {$ scope.paginationconf.totalitems = response.count.count.count; scope. Paging Parameter Dasar $ scope.paginationconf = {currentpage: 1, itemsperpage: 5};/************************************************************************* dipantau secara terpisah, dua acara latar belakang akan dipicu. ['$ http', function ($ http) {var list = function (postdata) {return $ http.post ('/karyawan/getAllemployee', postdata);} return {list: function (postData) {return list (postData);}}}}]; </postdata) {list «postData);}}}];Konten di atas adalah kode contoh yang diperkenalkan editor kepada Anda untuk mengimplementasikan fungsi paging berdasarkan AngularJS. Saya harap ini akan membantu semua orang!