การแสดงรายการรายการเป็นงานทั่วไปสำหรับเว็บแอปพลิเคชันส่วนใหญ่ โดยปกติข้อมูลของเราจะค่อนข้างใหญ่และไม่สามารถแสดงได้ดีในหน้าเดียว ในกรณีนี้เราจำเป็นต้องแสดงข้อมูลในรูปแบบหน้าด้วยฟังก์ชั่นของการไปที่หน้าก่อนหน้าและหน้าถัดไป ตอนนี้ฉันกำลังเรียนรู้เชิงมุมโดยใช้การแบ่งหน้า AngularJS ตามการใช้งานคำสั่งและการใช้ bootstrap อย่างมีสไตล์และเพิ่มแท็กโดยตรงไปยังรหัส HTML เพื่อเรียกมัน
มาดูการเรนเดอร์ก่อน
รหัสตัวอย่าง
app.directive ('pagepagination', function () {return {จำกัด : 'e', เทมเพลต: '<div> <ul> <li ng-class = "page.style" ng-repeat = "ใน pagelist"> <a href = "{{page.link}}" ng-if = "pagelist [0]"> <li> <pan> ทั้งหมด <b> {{pagerecord}} </b> บันทึก/ทั้งหมด <b> {{pagecount}} </b> หน้า </span> </li> : = "," pageurltemplate ":" = "}, คอนโทรลเลอร์: ['$ scope', ฟังก์ชั่น ($ scope) {$ scope.getLink = function (pageId) {return $ scope.pageurltemplate.replace (" page} ", pageid); $ scope.pageId - 1) / $ scope._pagesize) * $ scope._pagesize + 1; : $ scope.getLink (1)}); } page.push ({ชื่อ: 'หน้าถัดไป', สไตล์: $ scope.pageId == $ scope.pagecount? $ scope.getLink ($ scope.pageCount)}); !! $ scope.pagesize) {$ scope._pagesize = parseint ($ scope.pagesize); $ scope.pageId <1) {$ scope.pageId = 1; $ scope.pageInit ();}]}});รหัสโทร:
<หน้าเว็บ Page-id = "PageId" Page-record = "RecordCount" Page-url-template = "urltemplate"> </page-pagination>
ข้างต้นเป็นเนื้อหาทั้งหมดของรหัสการปนเปื้อน angular.js ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น