ASP.NET与导航、Razor视图、控制器有关的问题

Question

我正在为学校开发一个简单的网站应用程序，但导航有问题。

我正在使用Visual Studio 2019进行此项目。

我正试图从Views/Home/Index导航到Views/Product/List，但一直无法(404错误(。

这里是_Layout:

<nav class="navbar navbar-expand-md navbar-dark bg-primary">
<a class="navbar-brand" href="/">SportsPro</a>
<button class="navbar-toggler" type="button"
data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<nav class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="navbar-nav mr-auto">
<a class="nav-item nav-link active" asp-controller="Home" asp-action="Index">Home</a>
<a class="nav-item nav-link active" asp-controller="Product" asp-action="List">Products</a>
<a class="nav-item nav-link active" asp-controller="Technician" asp-action="List">Technicians</a>
<a class="nav-item nav-link active" asp-controller="Customer" asp-action="List">Customers</a>
<a class="nav-item nav-link active" asp-controller="Incident" asp-action="List">Incidents</a>
<a class="nav-item nav-link active" asp-controller="Registration" asp-action="GetCustomer">Registrations</a>
</div>
<div class="navbar-nav navbar-right">
<a class="nav-item nav-link active" asp-controller="Home" asp-action="About">About</a>
</div>
</nav>
</nav>

查看Views/Product/List:

@model Product
@{
ViewData["Title"] = "Products";
}
<h1>Product Manager</h1>
<form>...

HomeController:

using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;
using SportsPro.Models;
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
namespace SportsPro.Controllers
{
public class HomeController : Controller
{
private SportsProContext context { get; set; }
public HomeController(SportsProContext ctx)
{
context = ctx;
}
public IActionResult Index()
{
return View();
}
public IActionResult About()
{
return View();
}
public IActionResult Privacy()
{
return View();
}
....
}
}

ProductController:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore;
using SportsPro.Models;
namespace SportsPro.Controllers
{
public class ProductController : Controller
{
private SportsProContext context { get; set; }
public ProductController(SportsProContext ctx)
{
context = ctx;
}
[HttpGet]
public IActionResult Add()
{
ViewBag.Action = "Add";
ViewBag.ProductCode = context.Products.OrderBy(p => p.Name).ToList();
return View("Edit", new Product());
}
[HttpGet]
public IActionResult Edit(int id)
{
ViewBag.Action = "Edit";
ViewBag.ProductCode = context.Products.OrderBy(p => p.Name).ToList();
var product = context.Products.Find(id);
return View(product);
}
[HttpPost]
public IActionResult Edit(Product product)
{
if (ModelState.IsValid)
{
if (product.ProductID == 0)
context.Products.Add(product);
else
context.Products.Update(product);
context.SaveChanges();
return RedirectToAction("List", "Product");
}
else
{
ViewBag.Action = (product.ProductID == 0) ? "Add" : "Edit";
ViewBag.ProductCode = context.Products.OrderBy(p => p.Name).ToList();
return View(product);
}
}
[HttpGet]
public IActionResult Delete(int id)
{
var product = context.Products.Find(id);
return View(product);
}
[HttpPost]
public IActionResult Delete(Product product)
{
context.Products.Remove(product);
context.SaveChanges();
return RedirectToAction("List", "Product");
}
}
}

是否还有其他代码示例可以帮助解决我的问题？我觉得我的问题在于我的ProductController。

Answer 1

据我所知，您需要单击菜单栏上的"产品"按钮，然后转到列出产品的页面。

<a class="nav-item nav-link active" asp-controller="Product" asp-action="List">Products</a>

上述代码的含义如下：转到您的产品控制器，然后转到该控制器的List操作。

要做到这一点，首先必须在Product控制器中创建一个名为List((的函数。到目前为止，您的Product控制器中似乎还没有一个名为List((的函数。

public async Task<IActionResult> List()
{
var products = await context.Products.ToListAsync();
return View(products);
}

创建List函数后，您应该将模型从控制器返回到Views/Product/List.cshtml

然后，您可以在视图中使用该模型，如下所示：

@model IEnumerable<Product>
<div>
@foreach(var product in Model){
<a>@product.Name</a>
}
<div>