MVC3 嵌套部分页面（和视图模型）：如何绑定表单字段？

Question

我有 2 个这样的视图模型：

public class ViewModel1 // maps to Model1
{
    public string ViewModel1Desc { get; set; }
    public ViewModel2 ViewModel2 { get; set; }
    public ScheduleMasterEditViewModel()
    {
        ViewModel2= new ViewModel2();
    }
}

public class ViewModel2 // maps to Model2
{
    public string ViewModel2Desc { get; set; }
}

现在，我想要 ViewModel2 的部分页面并将其包含在 ViewModel1 的创建页面中：

Create.cshtml 看起来像这样

@model ViewModels.ViewModel1
@using (Html.BeginForm()) {
    @Html.EditorFor(model => model.ViewModel1Desc )
    @Html.Partial("~/Views/ViewModel2/_ViewModel2Create.cshtml", Model.ViewModel2)
}

_ViewModel2Create.cshtml 看起来像

@model ViewModels.ViewModel2
@Html.EditorFor(model => model.ViewModel2Desc )

问题是，在 Create 控制器上Model1，没有任何内容绑定到 ViewModel1.ViewModel2

我是否以正确的方式执行此操作，或者我应该像这样写出所有字段：

Answer 1

ViewModel2 未绑定的原因是，当您查看生成的 HTML 时，您会注意到为此子模型创建的输入字段的名称不正确：

<input type="text" name="ViewModel2Desc" />

而正确的是：

<input type="text" name="ViewModel2.ViewModel2Desc" />

原因是您的 _ViewModel2Create. cshtmlpartial 不保留父级的导航属性上下文。

因此，我建议您使用编辑器模板而不是部分调用：

@model ViewModels.ViewModel1
@using (Html.BeginForm()) {
    @Html.EditorFor(model => model.ViewModel1Desc)
    @Html.EditorFor(model => model.ViewModel2)
}

然后将部分代码移至 ~/Views/Shared/EditorTemplates/ViewModel2.cshtml 内：

@model ViewModels.ViewModel2
@Html.EditorFor(model => model.ViewModel2Desc)

注意编辑器模板的位置：~/Views/Shared/EditorTemplates。这很重要。这是 ASP.NET MVC 查找它的地方。事实上，它会首先在 ~/Views/XXX/EditorTemplates 中查找，其中 XXX 是您当前的控制器名称，以获取更具体的模板，如果在共享文件夹。另请注意文件的名称：ViewModel2.cshtml。这也很重要，而且按照惯例是有效的。模板的名称实际上是属性的类型。

您可以覆盖此：

@Html.EditorFor(model => model.ViewModel2, "_ViewModel2Create")

或在视图模型上使用 UIHint 属性：

public class ViewModel1
{
    public string ViewModel1Desc { get; set; }
    [UIHint("_ViewModel2Create")]
    public ViewModel2 ViewModel2 { get; set; }
    public ScheduleMasterEditViewModel()
    {
        ViewModel2 = new ViewModel2();
    }
}

然后使用 ~/Views/Shared/EditorTemplates/_ViewModel2Create.cshtml。