如何将数据库中的数据添加到 ASP.NET Core MVC (.NET 6) 应用程序中的共享 _Layout.cshtml?

How do you add data from the database to the shared _Layout.cshtml in ASP.NET Core MVC (.NET 6) application?

NET 大师们,我快要疯了。我已经尝试了 3 天,但似乎没有任何效果。我创建了一个局部视图,一个基本控制器,尝试了不同的功能。我找到的每个解决方案都已过时。

现在有人知道如何在 ASP.NET Core .NET 6,带 Razor 页面的 MVC 中做到这一点吗?我找不到合适的文档。

我的 _Layout.cshtml 中有一个菜单,想在那里显示数据库中的类别,但模型始终为 NULL。我在不同的视图中显示数据没有问题,我似乎无法将模型添加到 _Layout.cshtml。

布局视图可以有类型化模型。对于 razor 页面,我将介绍一个基页模型;

interface IViewTemplate{
    IEnumerable<string> GetCategories();
}
public abstract class BasePageModel : PageModel, IViewTemplate{
    ...
}
public class MyPageModel : BasePageModel
    ...
}

那么你的观点就可以了;

@model IViewTemplate

@foreach(var category in Model.GetCategories()){
    ...
}

您可以尝试使用View Component来渲染类别。

例如,我们可以参考以下步骤在MVC应用程序布局页面中显示类别:

  1. 创建名为 ViewComponents 的新文件夹。在此文件夹中,创建名为 CategoryViewComponent.cs 的新 class,如下所示:

    using Microsoft.AspNetCore.Mvc;
    using WebApplication1.Data;
    
    namespace WebApplication1.ViewComponents
    {
        [ViewComponent(Name ="Category")]
        public class CategoryViewComponent:ViewComponent
        {
            private readonly ApplicationDbContext _context;
            public CategoryViewComponent(ApplicationDbContext applicationDbContext)
            {
                _context = applicationDbContext;
            }
    
            public async Task<IViewComponentResult> InvokeAsync()
            {
                return View("Index", _context.Categories.ToList());
            }
        }
    }
    
  2. 在 Views 文件夹中,创建路径为 Views\Shared\Components\Category 的新文件夹。在类别文件夹中,创建名为 Index.cshtml:

    的新文件夹
    @model List<WebApplication1.Data.Category>
    
    <h2>Category</h2>
    
    <ul>
        @foreach(var item in Model)
        {
            <li>@item.CategoryName</li>
        }
    </ul>
    
  3. 在_Layout.cshtml页面调用视图组件:

    <div class="container">
        <main role="main" class="pb-3">
            @await Component.InvokeAsync("Category")
            @RenderBody()
        </main>
    </div>
    

文件结构如下:

那么,结果是这样的:

如果使用 Razor 页面应用程序,请使用如下相同的代码和文件结构:

那么,结果是这样的:

更详细的信息,您也可以参考View Components in Razor Pages