8

Razor ビューで 4 番目のループごとに新しいテーブル行を作成するにはどうすればよいですか? これは、4 より前の数値ごとに新しい行を作成し、新しい行の作成を終了します。

  @{
            int i = 0;
         }
         @foreach (var item in ViewBag.ProgramIdList)
         {

          if((i / 4) == 0)
          {
              @:<tr>
          }
          <td>
          <input type="checkbox" name="@item.ProgramId" id="@item.ProgramId" />   
         <label for="@item.ProgramTitle">@item.ProgramTitle</label>
         </td>
        if((i / 4) == 0) 
        {
        @:</tr>
          }
             i++;
         }
4

3 に答える 3

23

モジュロ演算子を使用します。為に :

if((i % 4) == 0)
{
  @:<tr>
}

if((i % 4) == 3)
{
  @:</tr>
}

アイテムの数が偶数行に分割されない場合は、ループの後に残りのセルと終了行タグを追加します。

if ((i % 4) != 0) {
  while (i % 4) != 0) {
    @:<td></td>
    i++;
  }
  @:</tr>
}
于 2012-10-05T21:51:40.697 に答える
8

上記の回答のコードで表示される構文ハイライト警告が嫌いな人には、解決策があります (メカニズムはほぼ同じです)。

<table>
    @for (int i = 0; i < ViewBag.MyItems.Count; i++)
    {
        var cells = 4;
        var item = ViewBag.MyItems[i];

        if ((i % cells) == 0)
        {
            @:<tr>
        }

        <td>
            @item.MyTextOrWhatever
        </td>

        if (i == (ViewBag.MyItems.Count - 1))
        {
            while ((i % cells) != 0)
            {
                @:<td></td>
                i++;
            }
        }

        if ((i % cells) == (cells - 1)) // aka: last row cell
        {
            @:</tr>
        }
    }
</table>

各タグは正しい位置 ( <td>inside <tr><tr>inside <table>) にあり、Visual Studio のシンタックス ハイライターはあなたを安心させてくれます :-)

于 2015-05-13T14:53:00.567 に答える
0

それは 100% 機能する正確なソリューションです。

            @foreach (var item in ViewBag.data)
            {
                var cells = totalCells;


                if ((i % cells) == 0)
                {
                    @:<tr>
                }
                <td>
                    @item.Value
                </td>



                if ((i % cells) == (cells - 1)) // aka: last row cell
                {
                @:</tr>

                }
                i++;
            }
于 2017-02-18T12:06:46.203 に答える