将PagedList用于分页产品列表

Question

我正在尝试显示产品列表并显示分页。因此，我决定使用PagedList插件。我在下面的链接中阅读了一些有关如何修改控制器并进行查看的示例。https://github.com/TroyGoode/PagedList

但是，我没有使用ViewBag，而是通过对控制器进行了一些修改设法将一组产品发送给控制器：

public ActionResult Index(string name)
{
    IEnumerable<ProductModel> productList = new HashSet<ProductModel>();

    if (string.IsNullOrWhiteSpace(name))
    {

    }
    else
    {
        CategoryModel category = db.Categories.Where(x => x.CategorytUrl == name).FirstOrDefault();
        if (category != null)
        {
            int catId = category.Id;
            string catName = category.Name;
            ViewBag.categoryName = category.Name;
            List<SpecItemsModel> options = Products.GetFilter(category.Id);
            //initialize the list
            //productList = Products.ProductLists(catId);
            ViewBag.filters = options;
            var childrenIDs = db.Categories.Where(x => x.ParentId == category.Id).Select(x => x.Id);
            var grandchildrenIDs = db.Categories.Where(x => childrenIDs.Contains((int)x.ParentId)).Select(x => x.Id);
            List<int> catIds = new List<int>();
            catIds.Add(category.Id);
            catIds.AddRange(childrenIDs);
            catIds.AddRange(grandchildrenIDs);

            var templates = db.ProductTemplates.Where(t => catIds.Contains(t.CategoryId)).Select(x => x.Id);
            productList = db.Products.Where(p => templates.Contains(p.ProductTemplateId));
        }
    }
                var pageNumber = page ?? 1;
        //var onePageOfProducts = productList.OrderBy(i => i.AdminRate).ToPagedList(pageNumber, 2);
        //ViewBag.OnePageOfProducts = onePageOfProducts;
        return View(productList.OrderBy(i => i.AdminRate).ToPagedList(pageNumber, 2));
}

因此，产品在他的视图中显示为2个产品组。我唯一不知道的是如何修改我提到的用于显示分页控件的示例的html pager。 ：

    @model IEnumerable<fardashahr.Models.ProductModel>

    <div class="col-md-9">

        @foreach (var item in Model)
        {
                    <a href="@Url.Action("Details","Home",new { name = item.ProductUrl })">
                        <img class="bd-placeholder-img card-img-top mw-100" src="/Images/Uploads/Products/@item.Id/Thumbs/@item.ImageName" />
                    </a>
                        <p class="card-text">
                            <h3>
                                @item.ShortName
                            </h3>
                        </p>
        }
    </div>
</div>

有什么建议吗？

Answer 1

如果要获取分页列表，可以尝试Pagination.js。

不要重新发明轮子。