如何在 ASP.NET Core 中顯示名稱而不是 id？

Question

我將 Visual Studio 與 ASP.NET Core Web App (.NET 6.0) 一起使用。我使用 Microsoft SQL Server Management Studio 19 作為數據庫。 目前，我遇到了一個問題，它在圖書索引中顯示的是 id 而不是 name。

我在數據庫中有類別表並將其顯示在下拉框中

但是當我在索引中顯示產品詳細信息時，類別成為類別的 ID

這是我的代碼： https ://github.com/thorgia1702/FPTBook

我試過使類別名稱成為遷移文件中 book 表中的 FK 鍵，但沒有成功

Answer 1

我認為這種方法的問題是你應該包括異物。 原因是ToListAsync()實現了查詢，如果不調用 Include，則不會加載類別數據。

public async Task<IActionResult> Index()
{
     return View(await _context.Books.Include(b => b.Category).ToListAsync());
}

我還發現，當你添加一本新書時，你應該使用CategoryId而不是Category 。

var category = await _context.BookCategories.FindAsync(model.CategoryId);

Answer 2

要在 ASP.NET Core Web 應用中顯示類別名稱而不是其 ID，可以結合使用外鍵關系和 LINQ 查詢。 以下是如何執行此操作的示例：

在您的數據庫中，定義 Categories 表和 Books 表之間的外鍵關系。 您可以通過將 CategoryId 列添加到 Books 表並將其設置為引用 Categories 表中的 Id 列的外鍵來執行此操作。

在您的 ASP.NET Core 應用中，為 Categories 表創建一個模型類。 此模型類應包括一個用於 Id 列的屬性和一個用於 Name 列的屬性。

在檢索書籍列表的控制器操作中，使用 LINQ 查詢將 Books 表與 Categories 表連接起來。 這將允許您在單個查詢中檢索圖書數據和類別數據。

在顯示圖書列表的視圖中，使用類別模型的 Name 屬性來顯示類別名稱而不是 CategoryId。

以下是控制器操作和視圖的示例：

控制器動作：

public async Task<IActionResult> Index()
{
    var books = from b in _context.Books
                join c in _context.Categories on b.CategoryId equals c.Id
                select new BookViewModel
                {
                    Id = b.Id,
                    Title = b.Title,
                    Author = b.Author,
                    Category = c.Name
                };

    return View(await books.ToListAsync());
}

看法：

@model IEnumerable<BookViewModel>

<table>
    <tr>
        <th>Title</th>
        <th>Author</th>
        <th>Category</th>
    </tr>
    @foreach (var item in Model)
    {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.Title)</td>
            <td>@Html.DisplayFor(modelItem => item.Author)</td>
            <td>@Html.DisplayFor(modelItem => item.Category)</td>
        </tr>
    }
</table>

在此示例中，BookViewModel 類是一個自定義模型類，其中包含書籍數據的屬性和類別名稱。 控制器操作中的 LINQ 查詢將 Books 表與 Categories 表連接起來，並選擇視圖模型所需的數據。 然后視圖使用視圖模型的類別屬性來顯示類別的名稱。

我希望這有幫助。 如果您有任何問題，請告訴我。

Answer 3

我測試了你的項目，我有如下想法，你可以試試下面的代碼嗎？

1. 從您的 .csproj 文件中刪除此行，閱讀此內容以了解更多信息：

<Nullable>enable</Nullable>

在圖書控制器中：

1.更改索引動作添加.Include ，使用Include方法指定查詢結果中包含的相關數據。 :

 public async Task<IActionResult> Index()
        {
            return View(await _context.Books.Include(x=>x.Category).ToListAsync());
        }

2.像您在 CategoryController 中的創建操作一樣更改后創建操作：

 public async Task<IActionResult> Create([Bind("Id,Title,ReleaseDate,Price,CategoryId")] Book model)
        {
            if (ModelState.IsValid)
            {
                _context.Add(model);
                await _context.SaveChangesAsync();
                return RedirectToAction(nameof(Index));
            }
            ViewData["CategoryId"] = new SelectList(_context.Set<Category>(), "CategoryId", "Name",model.CategoryId);
            return View(model);
        }

3.結果：