如何在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實際上將不再為您生成單個字段，基本上使您回到了開始時遇到的相同問題。 相反，它只會轉儲您的自定義模板並每天調用它。