ejs算是蠻多人用的一個node.js的後模板引擎
最近用它實現了分頁
模板層代碼如下
<div class="pagination">
<ul>
<li>
<a href='/?tab=<%=tab%>&page=1'><<</a>
</li>
<% if(page>3&&page>5){%>
<li>
<a>......</a>
</li>
<%}%>
<%
var i = 2;
if(pageCount<=5){
i=page-1
}
//倒數每二頁
if(page+1==pageCount&&page>=5){
i=3
}
//最後一頁
if(page+1>pageCount&&page>=5){
i=4
}
while(i>=1){%>
<li><a href='/?tab=<%=tab%>&page=<%=page-i%>'><%=page-i%></a></li>
<%
i--
}
%>
<li class='disabled active'>
<a href='/?tab=<%=tab%>&page=<%=page%>'><%=page%></a>
</li>
<%
var i = 1;
var num=2
//前二頁
if(page<3){
num=5-page
}
while(i<=num){
if(page+i<=pageCount){%>
<li><a href='/?tab=<%=tab%>&page=<%=page+i%>'><%=page+i%></a></li>
<%}
i++
}
%>
<% if(pageCount-(page+3)>=0&&pageCount>5){%>
<li>
<a>......</a>
</li>
<%}%>
<li>
<a href='/?tab=<%=tab%>&page=<%=pageCount%>'>>></a>
</li>
</ul>
</div>
pagecount是總頁,page是當前頁碼
其實沒多難就是當前頁面加上前兩頁+後兩頁,再處理一下前兩頁,也就是1、2頁,還有最後兩頁,加上前5頁的特殊情況就行了。
controller中的核心代碼
var ep=new eventproxy()
ep.all('topic_data_ok','page_count_ok',(topics,pageCount)=>{
res.render('index',{topics:topics,tab:tab,page:page,pageCount:pageCount})
})
var count=3
var option={skip:(page-1)*count,limit:count,sort:'-insertTime'}
topicModel.getTopics(query,option,(err,topics)=>{
topics=_.map(topics,(topic)=>{
topic.timeStr=common.formatTime(topic.insertTime)
return topic
})
ep.emit('topic_data_ok',topics)
})
//一個mongose的集合model,默認有count方法
topicModel.count(query,(er,allCount)=>{
var pageCount=Math.ceil(allCount/count)
ep.emit('page_count_ok',pageCount)
})