将数据从控制器传输到视图-List <> / IEnumerable <>？

Question

I'm building an asp.net MVC application using the Entity Framework, but it's not working the way I want it to.

This is my model (not all model classes, but that's not relevant):

public class Product
{
    public Product()
    {
        Categories = new List<Category>();
    }

    public int ProductID { get; set; }

    public byte[] Image { get; set; }
    public string Name { get; set; }
    public string Description { get; set; }
    public decimal Price { get; set; }

    public Offer Offer { get; set; }

    public virtual ICollection<Category> Categories { get; set; }
}

public class Category
{
    public Category()
    {
        Products = new List<Product>();
    }

    public int CategoryID { get; set; }

    public byte[] Image { get; set; }
    public string Name { get; set; }
    public string Description { get; set; }

    public virtual ICollection<Product> Products { get; set; }
}

What I am building now is a page to show all products in a specific category. So if you go to, let's say, /Category/1 it should show all products in category 1. Currently I am doing it this way. In the controller I have this method:

public ActionResult Category(int ID)
{
    return View(db.Categories.Where(c => c.CategoryID == ID).Include(c => c.Products));
}

which should load all products of that specific category and send that data to the view:

@model IEnumerable<Webshop.Models.Product>

@{
    ViewBag.Title = "Category: " + @ViewBag.CategoryName;
}

<h2>@ViewBag.CategoryName</h2>

<table>
    <tr>
        <th>@Html.DisplayNameFor(model => model.FirstOrDefault().Name)</th>
        <th>@Html.DisplayNameFor(model => model.FirstOrDefault().Price)</th>
        <th>Details</th>
    </tr>

    @foreach (var product in Model)
    {
        <tr>
            <td>@product.Name</td>
            <td>@product.Price</td>
            <td>@Html.ActionLink("Details", "Product", new { ID = product.ProductID })</td>
        </tr>
    }
</table>

This should work, right? Well it's not. If I go to /Category/1 I get the following error:

The model item passed into the dictionary is of type 'System.Data.Entity.Infrastructure.DbQuery 1[Webshop.Models.Category]', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable 1[Webshop.Models.Product]'.

Adding .ToList() in the controller doesn't work.

Actually it makes sense, but I don't know any other way to do this. And what is even weirder is that I followed an asp.net tutorial from Microsoft where they did exactly this.

I hope anyone can help me figure this out.

Answer 1

Your view is expecting a model of IEnumerable<Webshop.Models.Product> , but your controller method is returning a collection of Category objects.

I'd change your view to this:

@model Webshop.Models.Category

@{
    ViewBag.Title = "Category: " + Model.Name;
}

<h2>@ViewBag.CategoryName</h2>

<table>
    <tr>
        <th>@Html.DisplayNameFor(model => model.Products.FirstOrDefault().Name)</th>
        <th>@Html.DisplayNameFor(model => model.Products.FirstOrDefault().Price)</th>
        <th>Details</th>
    </tr>

    @foreach (var product in Model.Products)
    {
        <tr>
            <td>@product.Name</td>
            <td>@product.Price</td>
            <td>@Html.ActionLink("Details", "Product", new { ID = product.ProductID })</td>
        </tr>
    }
</table>

Then your controller method becomes this:

public ActionResult Category(int ID)
{
    return View(db.Categories.Where(c => c.CategoryID == ID).Include(c => c.Products).FirstOrDefault());
}

You'd probably want to do some check to make sure the category was found instead of returning a null Category as this will do if the given ID isn't found.