如何在Aspnet.core Razor中的foreach循环中使用Model动态填充HTML？

Question

我实际上是尝试在Asp.Net Core Razor中动态填充html代码，并且我想使用如下代码：

@model Aktienverwaltung.Models.ProtokollDividenden

foreach (var item in Model)
{
   <div class="form-group row">
       <label asp-for="@item" class="col-lg-3 control-label text-lg-right pt-2" for="inputRounded"></label>
       <div class="col-lg-6">
           <input asp-for="@item" class="form-control input-rounded" id="inputRounded" />
       </div>
       <span asp-validation-for="@item" class="text-danger"></span>
   </div>
}

这是我的控制器的一部分：

public async Task<IActionResult> Edit(Guid? id)
{
    if (id == null)
    {
        return NotFound();
    }

    var protokollDividenden = await _context.ProtokollDividenden.FindAsync(id);
    if (protokollDividenden == null)
    {
        return NotFound();
    }
    // return View(await _context.ProtokollDividenden.ToListAsync());
    return View(protokollDividenden);
}

和模型：

public partial class ProtokollDividenden
    {
        public Guid Id { get; set; }
        public string Aktie { get; set; }
        public string Depotname { get; set; }
        public string Wkn { get; set; }
        public string Kuerzel { get; set; }
        public double Dividende { get; set; }
        public DateTime Datum { get; set; }
        public bool BereitsVerarbeitet { get; set; }
    }

我尝试的所有内容都出错了，因为我无法枚举模型或其他内容。 我也尝试将其作为List使用（请参阅Controller中未注释的区域），但是我无法使foreach循环正常工作-有人有想法吗？

Answer 1

首先，您只能枚举一个枚举 ，即IEnumerable<T> ， List<T>等。现在，您只有一个项目作为模型，因此foreach 显然会失败。

假设您确实返回了可枚举的模型，那么下一个问题是模型绑定。 为了正确地将您发布的数据绑定到操作上的参数，列表类型必须根据CollectionProperty[N].Property的格式命名，其中N是索引。 为了使诸如标签助手之类的东西能够在表单输入中生成正确的name属性，它们需要完整的模型表达式。 您可以将模型表达式视为要绑定到的特定属性的映射。

假设您要我提供前往某个地方的路线。 理想情况下，您需要从当前位置开始的步骤。 如果我从其他地方开始我的路线，那将无济于事，因为在遵循我的路线到达最终目的地之前，您首先需要到达该位置的路线。

这里的概念相似。 使用foreach并创建item变量，基本上删除了指示的第一部分。 标签助手知道如何从item到您要绑定的属性，但是他们不知道如何到达item 。 这样，您最终将获得诸如item.Foo类的item.Foo ，该名称将无法绑定到任何有意义的东西。 相反，您需要在循环中使用for循环和使用索引的完整模型表达式：

@for (var i = 0; i < Model.Count; i++) // assuming `Model` is a list
{
    <input asp-for="@Model[i].Foo" />
}

值得注意的是，上述asp-for的值是一种特殊的构造，因为Model本身就是您要迭代的列表。 相反，如果它是模型上的list属性，则只需使用asp-for="ListProperty[i].Foo" 。 之所以有@Model部分，是因为必须在索引符号之前使用一些实际的成员。 我已经看到人们对此感到困惑，并开始尝试在所有内容之前贴上@Model ，即@Model.ListProperty[i].Foo 。

编辑

好。 我想我知道你现在去，但你的问题是关闭的方式在传达该商标。 如果您正在寻找某种方法来自动为模型的每个成员生成输入，而不必逐个成员进行，那么答案很模糊。

有Html.EditorFor和Html.EditorForModel （我认为它们仍存在于ASP.NET Core中……我个人不使用它们）。 两者都是“模板化助手”，这意味着它们依靠模板来确定如何处理传递给他们的内容。 由于您是在这里直接使用模型，因此需要Html.EditorForModel ，您可以通过以下方式使用它代替所有其他当前视图代码：

@Html.EditorForModel()

开箱即用，将根据成员的特定类型查看每个成员，并为每个成员生成一组输入和标签，最终看起来像：

<label for="Id">Id</label>
<input id="Id" name="Id" value="" />

<label for="Aktie">Aktie</label>
<input id="Aktie" name="Aktie" value="" />

<label for="Depotname">Depotname</label>
<input id="Depotname" name="Depotname" value="" />

...

这有一些明显的问题。 它没有任何Bootstrap类或结构，因此看起来很糟糕。 从类型到输入映射的解释非常简单。 例如， Id是实际上可能根本不存在的东西，或者如果存在，则应该是隐藏的输入。 Aktie可能是一个长格式的文本字段，但是您总会得到一个输入，而不是诸如textarea东西。 也许Depotname应该是select有可能的选择一些名单，但同样，你永远只能会得到一个基本的文本输入。 名单还在继续。

其中一些可以比其他更容易修复。 若要具有隐藏的输入，请将[HiddenInput]属性应用于您的类中的属性。 可以应用DataType属性来提供更多上下文。 例如，如果您需要textarea ，则可以将[DataType(DataType.MultilineText)]到类中的属性。 如果需要更改标签文本，可以使用[Display(Name = "My Label Text")]进行更改。

对于更复杂的事情，模板就是从这里开始的。例如，您可以创建一个诸如Views\\Shared\\EditorTemplates\\String.cshtml类的Views\\Shared\\EditorTemplates\\String.cshtml并在其中添加：

@model string

<div class="form-group row">
   <label asp-for="@Model" class="col-lg-3 control-label text-lg-right pt-2" for="inputRounded"></label>
   <div class="col-lg-6">
       <input asp-for="@Model" class="form-control input-rounded" id="inputRounded" />
   </div>
   <span asp-validation-for="@Model" class="text-danger"></span>

然后，它将用于任何string类型的成员。 就像您想象的那样，您可以添加其他诸如DateTime.cshtml ， Int32.cshtml等的视图，这些视图将分别用于各自的类型。 您还可以为该DataType枚举的任何成员添加模板，因此可以具有MultilineText.cshtml ， EmailAddress.cshtml等。最后，有一个UIHint属性可用于指定任何模板。 例如，如果将[UIHint("Foo")]应用于属性，则将使用Foo.cshtml 。

您也可以为自己的自定义类型创建模板。 因此，例如，您可能有一个ProtokollDividenden.cshtml ，然后此视图实际上将用作该类的模板，这意味着它将用于您对@Html.EditorForModel()调用。

但是，所有这些都需要注意，一旦添加了自定义模板，您现在就要100％负责。 换句话说，如果您要为整个模型添加视图，则将接管该操作，而Html.EditorForModel实际上将不再为您生成单个字段，基本上使您回到了开始时遇到的相同问题。 相反，它只会转储您的自定义模板并每天调用它。