如何使用 Razor 将部分视图视图模型项目保存在主视图视图模型中？

这可能是一个棘手的问题，但就这样吧。

假设我有一个主视图，我们称之为MainView.cshtml.

Now, MainView.cshtml有一个专用的 ViewModel 称为MainViewModel.cs它保存一个变量Model.ExampleItems这是一个 IEnumerable 类ExampleItem.

现在假设我还有一个名为的部分视图_PartialView.cshtml谁的 ViewModel 只是ExampleItem.

好吧，这就是我被困住的地方。MainView.cshtml可以动态调用_PartialView.cshtml以便用户可以创建一个新的ExampleItem。如何保存每个用户创建的ExampleItem to MainViewModel的ExampleItems 的IEnumerable 吗？

这是一些示例代码

MainView.cshtml

@model Models.ViewModels.MainViewModel

@foreach (var item in Model.ExampleItems)
{
   await Html.RenderPartialAsync("_PartialView", item);
}

<button id="AddExampleItem" type="button" class="btn btn-primary">Add Example Item</button>

_PartialView.cshtml

@model Models.ExampleItem

<input asp-for="VariableOne" />
<input asp-for="VariableTwo" />
<input asp-for="VariableThree" />

我怎样才能把这个保存到原来的^^^Model.ExampleItems?

你在这里有两条前进的路。无论哪种方式，为了绑定发布的ExampleItem即，表单字段必须按以下格式命名ExampleItems[N].Property。因此，要实现这一目标，您可以这样做：

1. Use a for循环，而不是foreach并通过HtmlFieldPrefix:

   @foreach (var i = 0; i < Model.ExampleItems; i++)
   {
      var viewData = new ViewDataDictionary(ViewData);
      viewData.TemplateInfo.HtmlFieldPrefix = "ExampleItems[" + i.ToString + "]";
      await Html.RenderPartialAsync("_PartialView", Model.ExampleItems[i]);
   }
   

   你还需要做ExampleItems a List<ExampleItem>而不是IEnumerable<ExampleItem>否则您将引发枚举两次的异常（先计数，然后 for 循环）。

2. 创建编辑器模板ExampleItem然后利用EditorFor。只需创建一个视图~/Views/Shared/EditorTemplates/ExampleItem.cshtml，然后将部分代码放在那里。然后在您的主视图中您只需执行以下操作：

   @Html.EditorFor(m => m.ExampleItems)
   

   Razor 将智能地确定您向其传递了一个集合，并为集合中的每个项目呈现编辑器模板。另外，重要的是，它将具有集合的完整上下文，因此它将使用正确的名称前缀，以便所有内容都能在帖子上正确绑定。