我該如何修改這個Google類似的分頁？

Question

我的控制器類包含

var Paged = new PaginatedList<Products>(SideBar, page ?? 0, pageSize); 
if (Request.IsAjaxRequest()) 
{ 
    return PartialView("~/Views/Shared/_Grid.cshtml", Paged); 
} 
return View(Paged); 

的PaginatedList是

public class PaginatedList<T> : List<T> 
{ 

    public int PageIndex { get; private set; } 
    public int PageSize { get; private set; } 
    public int TotalCount { get; private set; } 
    public int TotalPages { get; private set; } 

    public PaginatedList(IQueryable<T> source, int pageIndex, int pageSize) 
    { 
     PageIndex = pageIndex; 
     PageSize = pageSize; 
     TotalCount = source.Count(); 
     TotalPages = (int)Math.Ceiling(TotalCount/(double)PageSize); 

     this.AddRange(source.Skip(PageIndex * PageSize).Take(PageSize)); 
    } 

    public bool HasPreviousPage 
    { 
     get 
     { 
      return (PageIndex > 0); 
     } 
    } 

    public bool HasNextPage 
    { 
     get 
     { 
      return (PageIndex + 1 < TotalPages); 
     } 
    } 
} 

而我的觀點是

<div class="pagination-container"> 
      <nav class="pagination"> 
       <ul> 
        @for (int i = 0; i < Model.TotalPages; i++) 
        { 
         <li><a href="@Url.Action("Index", "Home", new { page = i})" 
          class="@(i == Model.PageIndex ? "current-page" : "")">@(i + 1)</a></li> 
        } 
       </ul> 
      </nav> 

      <nav class="pagination-next-prev"> 
       <ul> 
        @if (Model.HasPreviousPage) { 
         <li><a href="@Url.Action("Index", "Home", new { page = (Model.PageIndex - 1) })" class="prev"></a></li> 
        } 
        @if (Model.HasNextPage) { 
         <li><a href="@Url.Action("Index", "Home", new { page = (Model.PageIndex + 1) })" class="next"></a></li> 
        } 
       </ul> 
      </nav> 
      <div> 
       Page @(Model.PageIndex + 1) of @Model.TotalPages 
      </div> 
     </div> 

的一個問題與上面的觀點，是它創建等於數字的網頁模型中的頁面大小。如果模型有6個頁面的結果是

如果我有100個Model.Pages會發生什麼？

Answer 1

你需要確保你分開你沒有返回模型中的所有數據 - 你只返回頁面大小，最多隻有一個單獨的屬性來存儲總數。

例如：

public class PageResult<T> where T : class 
{ 

    public PageResult(IEnumerable<T> items, int page = 1, int pageSize = 10) 
    { 
     this.Items = items; 
     this.PageSize = pageSize; 
     this.PageIndex = page; 
     this.PaginateData(page); 
    } 

    public IEnumerable<T> Items { get; private set; } 

    public int PageSize { get; private set; } 

    public int PageIndex { get; private set; } 

    public int Total { get; private set; } 

    public int TotalPages 
    { 
     get 
     { 
      return Math.Max((int)Math.Ceiling((Total/(double)PageSize)), 1); 
     } 
    } 

    private int _MaxPagesToDisplay = 10; 

    public int MaxPagesToDisplay 
    { 
     get { return _MaxPagesToDisplay; } 
     set { _MaxPagesToDisplay = value; } 
    } 

    public int PagesToDisplay 
    { 
     get 
     { 
      return Math.Min(this.MaxPagesToDisplay, TotalPages); 
     } 
    } 

    public void PaginateData(int page) 
    { 
     if(this.Items == null) return; 
     this.Total = this.Items.Count(); 
     this.Items = this.Items.Skip(this.PageSize * this.PageIndex - 1).Take(this.PageSize); 
    } 

} 

這將意味着你可以返回例如，1萬名的成績和總設置爲1萬元，但只能插入10到項集合。 You can use Linq to paginate the data into this collection。我添加了方法PaginateData它爲你做。

然後你就可以更新您的看法：

@for (int i = 1; i <= Model.PagesToDisplay; i++) 
        { 
         <li><a href="@Url.Action("Index", "Home", new { page = i})" 
          class="@(i == Model.PageIndex ? "current-page" : "")">@(i)</a></li> 
        } 

然後，您可以用總場在頁面上顯示的總數。