在一个视图中呈现多个强类型的部分视图

本文关键字：视图 强类型 一个 | 更新日期: 2023-09-27 18:12:32

我有这个索引。cshtml类:

@model ProOptInteractive.ViewModels.InvoicePageViewModel
@{
    ViewBag.Title = "Index";
}
<div>@Html.Partial("ListServices", Model.Services)</div>
<div>@Html.Partial("ListProducts", Model.Products)</div>
<div>@Html.Partial("Invoice", Model.InvoiceViewModel)</div>

这是我的InvoicePageViewModel 

namespace ProOptInteractive.ViewModels
{
    public class InvoicePageViewModel
    {
        public InvoiceViewModel InvoiceViewModel { get; set; }
        public IEnumerable<Service> Services { get; set; }
        public IEnumerable<Product> Products { get; set; }
    }
}

问题是，每当我加载这个视图，我得到一个错误，说我已经传递了错误的模型给字典，它没有指定哪一个部分视图是导致问题。每个部分都有不同的模型类型，一个IEnumerable称为Product，另一个IEnumerable称为Service，而Invoice部分视图有一个视图模型称为InvoiceViewModel。

有谁能解释一下怎么做这件事吗?顺便说一下，我对Razor和MVC有点生疏。

我得到这个错误信息:

传入字典的模型项的类型是"ProOptInteractive.ViewModels"。

在一个视图中呈现多个强类型的部分视图

此错误是因为您已将Invoice部分视图设置为具有类型为InvoicePageViewModel的模型，但您正在传递类型为InvoiceViewModel的模型。

要么更新你的InvoiceViewModel属性为类型InvoicePageViewModel，或改变Invoice视图使用类型InvoiceViewModel的模型。

错误在<div>@Html.Partial("Invoice", Model.InvoiceViewModel)</div>行

您的视图Invoice正在接受类型的模型InvoicePageViewModel和你正在通过InvoiceViewModel

将代码更改为<div>@Html.Partial("Invoice", Model)</div>

或修改Invoice视图以接受InvoiceViewModel作为

@model ProOptInteractive.ViewModels.InvoiceViewModel

Invoice.cshtml可能以:

开头
@model ProOptInteractive.ViewModels.InvoicePageViewModel

替换为:

@model ProOptInteractive.ViewModels.InvoiceViewModel

你可以像这样传递模型给你的局部视图:

@Html.Partial("Invoice", Model.InvoiceViewModel)

或类似的

主视图模型:

class InvoicePageViewModel {
...
    public InvoiceViewModel InvoiceViewModel { get; set; }
    public IEnumerable<Service> Services { get; set; }
    public IEnumerable<Product> Products { get; set; }
...
}

然后更新你的部分视图来接受视图模型，像这样:

@model InvoiceViewModel
...

我发现了这个错误。它在控制器方法中。当我调用索引视图(对应于ActionResult Index方法)时，我将视图模型InvoiceViewModel返回到索引页面，尽管它是强类型的InvoicePageViewModel。我把它改成了这样，它可以工作了:

public ActionResult Index()
{
    var invoice = InvoiceLogic.GetInvoice(this.HttpContext);
    // Set up our ViewModel
    var pageViewModel = new InvoicePageViewModel
    {
        Products = proent.Products.ToList(),
        Services = proent.Services.ToList(),
        InvoiceViewModel = new InvoiceViewModel
    {
        InvoiceItems = invoice.GetInvoiceItems(),
        Clients = proent.Clients.ToList(),
        InvoiceTotal = invoice.GetTotal()
    }
};
    // Return the view
    return View(pageViewModel);
}

感谢大家的帮助和建议。

相关文章：