动态构建部分 Razor 视图 - 获取结束标记问题

Question

我正在根据模型列表中的条目数动态构建 Razor 视图的一部分。

在设计时，我在这个 if 的结尾 div 之前得到一个小红点：

     @if (lastOne == 'n')
     {
        </div> @* Finishes the row. *@
      }

在设计时，我在底部收到“结束标记缺少开始标记”。

我该如何解决？如果我得到它，我该如何动态构建它？

在运行时，正如预期的那样，我得到：遇到没有匹配的开始标签的结束标签“div”。你的开始/结束标签是否正确平衡？

这是 .cshtml 文件（视图）：

    <h2>Test</h2>

    @model GbngWebClient.Models.UserProfileForMaintVM

   @using (Html.BeginForm("UpdateUserProfile", "UserProfiler", FormMethod.Post))
   {
      <div style="margin-top:10px;"></div>

      <div class="panel panel-default">
         <div class="panel-heading aboutyou">It's All About You!</div>
         <br />
         <h5 class="single">General</h5>

         <div class="panel-body">
            <div class="row">
                <div class="col-md-2">
                    @Html.LabelFor(model => model.UserProfileSingleVM.WhoIAmDescr)
                    @Html.TextAreaFor(model => model.UserProfileSingleVM.WhoIAmDescr, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.UserProfileSingleVM.WhoIAmDescr, "", new { @class = "text-danger" })
                </div>
                <div class="col-md-2">
                    @Html.LabelFor(model => model.UserProfileSingleVM.ThinkingDescr)
                    @Html.TextAreaFor(model => model.UserProfileSingleVM.ThinkingDescr, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.UserProfileSingleVM.ThinkingDescr, "", new { @class = "text-danger" })
                </div>
            </div>
            <br />
        </div>

        <div class="panel-body">
            @{
               var lastOne = 'n';
               var colCount = 1;
            }

            @for (var i = 0; i < Model.UserProfileMultiList25.Count; i++)
            {
                if (colCount == 1)
                {
                    <div class="row">
                }

                <div class="col-md-3">
                   @Html.LabelFor(Model => Model.UserProfileMultiList25[i].Description))
                   @Html.CheckBoxFor(Model => Model.UserProfileMultiList25[i].SelectedSwitch, new { @class = "form-control" })
                </div>

                if (colCount == 3)
                {
                    </div> @* Finishes the row. *@
                    colCount = 1;
                    lastOne = 'y';
                }
                else
                {
                  colCount += 1;
                }
            }

            @if (lastOne == 'n')
            {
                </div> @* Finishes the row. *@
            }

       </div> @* Finishes the panel. *@

       <div class="panel-body">
           <div class="row">
               <div class="form-group">
                   <div class="col-md-offset-0 col-md-12">
                       @* Submit button. *@
                       <input type="submit" value="Save" class="btn btn-info" />
                   </div>
               </div>
           </div>
         </div>
     </div>
   }

   @Scripts.Render("~/bundles/jquery")
   @Scripts.Render("~/bundles/bootstrap")
   @Styles.Render("~/Content/css")

---

它可以工作，但不会用：

 <div class="row">....</div>.

完成工作：

        @for (var i = 0; i < Model.UserProfileMultiList25.Count; i++)
        {
            <div class="col-md-3">
                <div>
                    @Html.CheckBoxFor(Model => Model.UserProfileMultiList25[i].SelectedSwitch, new { @class = "form-control" })
                    <label>
                        @Html.DisplayFor(Model => Model.UserProfileMultiList25[i].Description)
                        @Html.HiddenFor(Model => Model.UserProfileMultiList25[i].SelectionId)
                        @Html.HiddenFor(Model => Model.UserProfileMultiList25[i].ProfileCategoryId)
                    </label>
                </div>
            </div>
        }

Answer 1

您在循环中声明colCount inside，并且每次都将其初始化为1。我猜你的意思是在循环之外声明和初始化它，所以它是一个实际的计数器：

@{
    var lastOne = 'n';
    var colCount = 1;
}

@for (var i = 0; i < Model.UserProfileMultiList25.Count; i++)
{
    if (colCount == 1)
    {
        <div class="row">
    }

    <div class="col-md-3">
        @Html.LabelFor(Model => Model.UserProfileMultiList25[i].Description))
        @Html.CheckBoxFor(Model => Model.UserProfileMultiList25[i].SelectedSwitch, new {      @class = "form-control" })
    </div>

    if (colCount == 3)
    {
        </div> @* Finishes the row. *@
        colCount = 1;
        lastOne = 'y';
    }
    else
    {
        colCount++;
    }
}

@if (lastOne == 'n')
{
    </div> @* Finishes the row. *@
}