如何在asp.net核心剃刀页面中实现分页

Question

我正在用ef学习asp.net核心剃刀页面.我想用我的表实现分页,我已经查看了本教程

https://docs.microsoft.com/en-us/aspnet/core/data/ef-rp/sort-filter-page?view=aspnetcore-2.1

但它只支持pre和next,我已经研究了很长时间,所有的解决方案都与asp.net核心mvc有关,但我使用的是razor页面,我的项目中没有控制器,有什么想法可以实现？

这就是我想要实现的效果

 <form method="get" asp-page="./Index">
                <nav aria-label="Page navigation">
                    <ul class="pagination">
                        <li>
                            <a href="#" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                            </a>
                        </li>
                        @{
                            var totalPages = Model.Products.Count % 2 == 0 ? Model.Products.Count / 2 : Model.Products.Count / 2 + 1;
                        }
                        @for (int i = 1; i <= totalPages; i++)
                        {
                            <li><a asp-page="./Index" asp-route-id="@i">@i</a></li>
                        }
                        <li>
                            <a href="#" aria-label="Next">
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </form>

cshtml.cs

  public async Task OnGetAsync(string sortOrder, string searchString, string shopString, string statusString, int page)
        {}

Answer 1

分页相对简单.有可以为你做的图书馆,但我开始发现它们比它们的价值更麻烦.

您需要来自请求的三条信息(或设置为默认值):

1. 页码(默认为1)
2. 页面大小(通常默认为10,但无论你想要什么)
3. 排序(不是绝对必要的,但你应该至少按顺序排序以保持结果在页面之间保持一致)

页码和大小为您提供"跳过"和"获取"值:

var skip = (page - 1) * size;
var take = size;

然后,您可以通过以下方式获取结果:

var pageOfResults = await query.Skip(skip).Take(take).ToListAsync();

在哪里- 要么直接query使用IQueryable,要么使用条款等.DbSetDbSetWhereOrderBy

然后,您只需要用于计算页面的项目总数:

var count = await query.CountAsync();

专业提示,您可以通过执行以下操作来并行化两个查询(结果和总计数):

var resultsTask = query.Skip(skip).Take(take).ToListAsync();
var countTask = query.CountAsync();

var results = await resultsTask;
var count = await countTask;

任务返回热门或已经开始.该await关键字简单地持有,直到任务完成代码的其余部分的延续.因此,如果您等待每一行,它们将按顺序完成,但如果您同时启动两个,然后等待每个行,它们将并行处理.

无论如何,一旦你计算了:

var totalPages = (int)Math.Ceil(Decimal.Divide(count, size));
var firstPage = 1;
var lastPage = totalPages;
var prevPage = Math.Max(page - 1, firstPage);
var nextPage = Math.Min(page + 1, lastPage);

注意:您可以根据它们是相等firstPage还是lastPage分别确定是显示第一个/上一个和上一个/下一个/下一个按钮.

然后,使用此信息构建自己的模型,然后将其发送到视图以呈现结果并生成分页HTML.

Answer 2

我为 .NET Core Razor Pages 创建了一个分页标签助手；它可以在 HTML 标签或 appsettings.json 文件中进行配置，以显示/隐藏上一页-下一页、倒数第二个按钮、最大显示页面数等。

安装 NuGet 包：

Install-Package LazZiya.TagHelpers

将标签助手添加到_ViewImports.cshtml文件中：

@addTagHelper *, LazZiya.TagHelpers

最后，将分页控件添加到视图中：

<paging 
    total-records="Model.TotalRecords" 
    page-no="Model.PageNo"
    query-string-value="@(Request.QueryString.Value)">
</paging>

从v3.1.0开始，query-string-value不再需要传递。此外，默认情况下所有选项均处于打开状态。

<paging 
    total-records="Model.TotalRecords" 
    page-no="Model.PageNo">
</paging>

使用 appsettings.json 进行分页配置将有助于获得更清晰的 HTML 代码，并能够在应用程序中立即更改所有或部分分页标记帮助器上的分页设置。

查看所有设置的现场演示：https://demo.ziyad.info/en/paging

相关文章：
https ://ziyad.info/en/articles/21-Paging_TagHelper_for_ASP_NET_Core