c# - 如何使用 Razor 在主视图 View 模型中保存部分 View View 模型项？

Question

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

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

现在，MainView.cshtml 有一个名为 MainViewModel.cs 的专用 ViewModel，它包含一个变量 Model.ExampleItems，它是一个 IEnumerable 类ExampleItem.

现在假设我还有一个名为 _PartialView.cshtml 的局部 View ，其 ViewModel 只是 ExampleItem。

好的，这就是我卡住的地方。 MainView.cshtml 可以动态调用 _PartialView.cshtml 以便用户可以创建新的 ExampleItem。如何将每个用户创建的 ExampleItem 保存到 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 中？

Answer 1

这里有两条前进的道路。无论哪种方式，为了绑定(bind)发布的 ExampleItem s，表单字段必须以 ExampleItems[N].Property 格式命名.因此，要实现这一点，您可以:

1. 使用 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一个List<ExampleItem>而不是 IEnumerable<ExampleItem>或者您将引发枚举两次的异常(计数然后 for 循环)。

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

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

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