應angular的spa專案需要,現後台管理系統中需要用到分頁,於是就找到了這個基於bootstrap的分頁,封裝性很好,用起來也非常方便,這裡是模擬的資料庫資料,實際中只需要將模擬資料換成介面呼叫返回的資料即可,並且可以實現按頁、按數量的按需載入,也可以全部載入,記得引入ui.bootstrap就可以了
效果如圖:
下面是完整可直接執行的**:
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>分頁
title
>
<
link
rel="stylesheet"
href
="">
<
script
src=""
>
script
>
<
script
src=""
>
script
>
<
script
src=""
>
script
>
<
style
>
style
>
<
script
>
angular.module(''
,['ui.bootstrap
']).controller(
"paginationctrl",
function
($scope,$log),,,
,,,,
,,,,
,,,,
]; $scope.sec
=[,,];
$scope.totalitems
=vm.commenlist.length;
$scope.currentpage=3
;//當前頁面數,設定預設進入的當前頁面
$scope.pagesize=5
;//改變量值,每個頁面拉的資料數目就會改變
$scope.pagenum
=math.ceil($scope.totalitems
/$scope.pagesize);
//當前頁面數
$scope.allitem=;
for(
vari=0
;i<
$scope.totalitems;i
+=$scope.pagesize)
vargetlist
=function
() $scope.pagechanged
=function
() })
script
>
head
>
<
body
>
<
div
ng-controller
="paginationctrl"
>
<
div
class
="table"
>
<
table
class
="table table-striped"
>
<
thead
>
<
tr>
<
th>序號
th>
<
th>title
th>
<
th>內容
th>
tr>
thead
>
<
tbody
>
<
tr ng-repeat
="item in allitem[currentpage-1]"
>
<
td>}
td>
<
td>}
td>
<
td>}
td>
tr>
tbody
>
table
>
div>
<
div
class
="page"
>
<
ul uib-pagination
boundary-links
="true"
class
="pagination-lg"
total-items
="totalitems"
ng-model
="currentpage"
items-per-page
="pagesize"
previous-text
="‹"
next-text
="›"
first-text
="«"
last-text
="»"
max-size
='3'
boundary-link-numbers
="true"
ng-change
='pagechanged()'
>
ul>
div>
div>
body
>
html
>
oracle中分頁的知識
一 前言 自從出來實習後,基本上都沒有按下心來總結下自己學的知識點,剛剛好現在快要國慶了,沒有到深圳出差,在公司呆了三天,可以說是在公司打了三天的醬油啊,所以前兩天都是在看些正則的文件,並且寫了下總結 等到要寫的時候才覺得好像也沒什麼要寫的啊 所以還是一點一點的寫吧,因為五月份的實習知識點自己也做了...
oracle中分頁查詢
上限條件必須放在子查詢,而下限條件必須放在外層查詢 rownum總是從1開始的,第一條不滿足去掉的話,第二條的rownum 又成了1 select from select rownum rowno,t.from tab t where rownum page size tab alias where...
mybatis中分頁查詢
1 如果在查詢方法中有多個引數,可以使用map物件將所有資料都儲存進去。比如分頁查詢,需要用到兩個引數,可以將這兩個引數包裝到map中。例子 分頁查詢 dao層方法 public listgetstudentpage int pstart,int pnumber throws exception c...