c# - 2 列布局循环通过 MVC 模型 c#

Question

我正在尝试使用 Razor 使用来自 MVC 模型的动态数据创建一个 2 列 Bootstrap 布局。目标是在循环完成之前在每一列中都有唯一的数据。以下代码在两列中重复相同的数据。为了使这项工作我需要什么逻辑

@{
int i=1;
foreach (var item in Model)
{
    <div class="row">
        <div class="col-md-6">
            <input type="checkbox" checked="@item.Checked" />
            @item.Description
        </div>
        <div class="col-md-6">
            <input type="checkbox" checked="@item.Checked" />
            @item.Description
        </div>
    </div>
    i++;
}

Answer 1

您需要在每一列上迭代您的项目，以便在每一列中获得不同的项目。一种方法是跟踪“偶数”和“奇数”迭代并基于此显示项目。

<div class="row">
int cnt1 = 0;
foreach (var item in Model)
{
  if(cnt1 % 2 == 0) {
    <div class="col-md-6">
        <input type="checkbox" checked="@item.Checked" />
        @item.Description
    </div>
  }
  cnt1++;
}
int cnt2 = 0;
foreach (var item in Model)
{
  if(cnt2 % 2 != 0) {
    <div class="col-md-6">
        <input type="checkbox" checked="@item.Checked" />
        @item.Description
    </div>
  }
 cnt2++;
}
</div> //end row

实现此目的的另一种方法是在 Controller 中将您的项目分成 2 个列表，并迭代列表 1 的第一列和列表 2 的第二列。