分页获取信息列表

# 模板中如何实现分页 在信息页中调用分页数据时,信息后面一般都需要分页控制按钮面板,分页面板是一个稍显繁琐的功能,下面直接上代码: ```cs @Html.Pager((IPagedList<Info>)ViewBag.PagedList, new PagerOptions { PageIndexParameterName = "pageIndex", FirstPageText = "首页", LastPageText = "尾页", PrevPageText = "上一页", NextPageText = "下一页", CurrentPagerItemTemplate = "<span class=\"current\">{0}</span>", DisabledPagerItemTemplate = "<span class=\"disable\">{0}</span>" }) ``` 运行后显示的界面如下: ![QQ截图20190805144435.png](https://cos.easydoc.net/70525496/files/jyy155z9.png) 如需要修改展示样式;请使用F12工具查看对应的css代码 ## 完整示例代码 `@using Yideas.Model;`所有模版必须包含此函数 `@using Webdiyer.WebControls.Mvc;`分页模版头部必须包含此函数 具体可参考[模版文件介绍](doc:yjXnlr3x) ```html @using Yideas.Model; @using Webdiyer.WebControls.Mvc; <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>@ViewBag.Column.ColumnName-@Html.Config("WebSiteTitle")</title> <meta name="keywords" content="@Html.Config("WebKeyWords")" /> <meta name="description" content="@Html.Config("WebDescript")" /> </head> <body> <section> <div class="clearfix"> <ul class="news_list"> @foreach (var item in ((PagedList<Info>)ViewBag.PagedList)) { <li class="clearfix"> <a href="@Url.Action("Detail", "Content", new { Id = item.InfoId })"> <div class="img-box" style="background-image:url(@Html.Image(item.DefaultPic))"><img src="@Html.TemplateDir()/statics/images/m.png" /></div> <div class="font-box"> <p>@item.Title</p> <span>@item.AddDate.ToString("yyyy-MM-dd")</span> </div> </a> </li> } </ul> </div> //通用分页代码 <div class="pagination"> @Html.Pager((IPagedList<Info>)ViewBag.PagedList, new PagerOptions { PageIndexParameterName = "pageIndex", FirstPageText = "首页", LastPageText = "尾页", PrevPageText = "上一页", NextPageText = "下一页", CurrentPagerItemTemplate = "<span class=\"current\">{0}</span>", DisabledPagerItemTemplate = "<span class=\"disable\">{0}</span>" }) </div> </section> </body> </html> ``` css代码示例 ```css .pagination{text-align:right} .pagination a, .pagination span{background:#fff;vertical-align:middle;border:1px solid #eee;color:#444;padding:5px 8px;margin:0 3px} .pagination a:hover{background:#eee;color:#0073dd} .pagination span.current{background:#0073dd;color:#fff} .pagination span.disable{background:#f2f2f2;color:#999} ``` 模板制作人员可以在上面代码基础上完善