ينعكس تركيز ترقيم الصفحات في استخدام المرشحات. هذا المرشح غير معقد أيضًا.
أولاً ، ضع رمز HTML:
<! doctype html> <html ng-app = "demoapp"> <head> <meta charset = "utf-"> <meta name = "viewport" content = "width = device-width"> <body> demo </title> <link rel = "stylesher" href = "demo.css" ng-controller = "democtrl"> <viv> <ul> <li ng-repeat = "الجمل في demolists [] ng-click = "prevpage ()"> الصفحة السابقة </a> <a ng-class = "{true: 'currentStep' ، false: 'step'} [num == currentpage]" ng-repeat = "num in pagenum" ng click = "setPage (num)"> {num+}}} ng-click = "nextpage ()"> الصفحة التالية </a> </viv> </viv> <script src = "angular.min.js"> </script> <!-تقديم ملف angularjs الخاص بك-> <script src = "demo.js"يتم استخدام فئة NG هنا. عندما تكون الصفحة الحالية الحالية مساوية لرقم الصفحة ، يتم عرض نمط CurrentStep ، وعندما لا يكون متساويًا ، يتم عرض نمط الخطوة.
رمز المفتاح في 13 سطر. عندما يحاكي NG-Repeat البيانات ، يسمى المرشح الترحيل وحد المرشح الزاوي.
ثم هناك رمز CSS ، لا يوجد شيء يمكن قوله ، بشكل أساسي لضبط النمط. تذكر أن تضيف أنمتين في فئة NG.
ul> li {style-style: none ؛ العرض: px ؛ الارتفاع: px ؛ الحدود: px solid #caf ؛ margin-bottom: px ؛ padding-left: px ؛}. لا شيء ؛ الخلفية: #fff ؛ عائم: اليسار ؛ المؤشر: مؤشر ؛} A.PrevLink: Hover ، A.NextLink: Hover {Background: #AAA! مهم ؛ اللون: #ffff! مهم ؛ Cursor: pointer ؛}. الخطوة {display: block ؛ line-leigh px ؛ font-size: px ؛ float: اليسار ؛ الهامش: px ؛ أسلوب القائمة: لا شيء ؛ المؤشر: مؤشر ؛}. PX ؛ على غرار القائمة: لا شيء ؛ المؤشر: مؤشر ؛}أخيرًا ، إنه JS
var demoapp = Angular.module ('demoapp' ، []) ؛ DemoApp.filter ('paging' ، function () {// paging filter function function (starts ، start) {// اثنين من القائمات المعلمة هما البيانات الأولية للبيانات الأولية الخاصة بك في html: // start ، تم تمرير المعلمات بعد الحدود ، Slists.slice (start) ؛ المطور. "،" شكرًا لك على قراءة هذا "،" لماذا أقول شكرًا لك "، لأن هذه الأشياء لا علاقة لها بدراسة Angularjs الخاصة بك" ، "هذه مجرد جمل تجريبية." ، "لا تملك أي معاني خاصة. $ scope.demolists [] name.length ؛ i = ؛ i <$ scope.pages ؛ i ++) {$ scope.pagenum.push (i) ؛} $ scope.currentPage = ؛ pages} $ scope.prevpage = function () {// انقر فوق الوظيفة التي تم تنفيذها في الصفحة السابقة إذا ($ scope.currentPage>) {$ scope.currentPage-؛}} $ scope.nextpage = function () $ scope.pages-) {$ scope.currentPage ++ ؛}}}]) ؛أريد أن أقول إن الوثنية التي تنشئها تبدأ من 0 ، لكن أرقام الصفحة الحقيقية تبدأ من البداية ، ولهذا السبب فإن الأسطر الـ 18 في HTML هي NUM +1.
المحتوى أعلاه هو الكود الذي يقوم فيه AngularJS بتنفيذ وظيفة الترحيل دون إدخال القطع التي تم تقديمها بواسطة المحرر. آمل أن تساعدك. إذا كنت تريد معرفة المزيد عن AngularJS ، فيرجى الانتباه إلى موقع Wulin.com!