紀錄一下 AngularJS 自製分頁 Filter 的方法
HTML:
<div ng-app="app" ng-controller="controller as ctrl"> <div ng-repeat="item in ctrl.itmeList | paging:ctrl.page:ctrl.pageSize"> {{item}} </div> <div> Page: <input type="number" ng-model="ctrl.page"/> </div> <div> Page size: <input type="number" ng-model="ctrl.pageSize"/> Page </div> </div>
Javascript:
var app = angular.module("app", []); app.controller("controller", [function() { var self = this; self.itmeList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; self.page = 1; self.pageSize = 3; }]); app.filter('paging', function() { return function(input, page, pageSize) { return input.slice(page * pageSize - pageSize, page * pageSize); } });
JsFiddle 範例:
參考資料:
沒有留言 :
張貼留言