Не получается создать условно новую строку таблицы, используя операторы Razor и if?

Question

Я хочу, чтобы цикл динамически создавал таблицу шириной до 2 столбцов, а затем увеличивал количество строк, пока в списке не осталось записей. Звучит легко, и я придумал это:

<table>
                    <tr>
                        @{ var i = 0; }
                        @foreach (var tm in Model.TeamMembers)
                        {
                            <td>@tm.FirstName @tm.LastName @tm.Role</td>

                            if(++i % 2 == 0)
                            {
                                </tr>
                                <tr>
                            }
                        }
                    </tr>
                </table>

Но я получаю сообщения об ошибках, ожидаемых как для цикла for, так и для оператора if. Если я изменю теги на что-то другое (например, например), это будет работать нормально.

Полагаю, он пытается проверить конец строки, видит его и решает, что цикл должен быть закончен? Как я могу заставить это НЕ делать этого, или мне нужно поместить всю таблицу в цикл с кучей беспорядочных условных выражений? (

Answer 1

Попробуйте так:

@{ var i = 0; }
@foreach (var tm in Model.TeamMembers)
{
    <td>@tm.FirstName @tm.LastName @tm.Role</td>
    if(++i % 2 == 0)
    {
        <text></tr><tr></text>
    }
}

или:

@{ var i = 0; }
@foreach (var tm in Model.TeamMembers)
{
    <td>@tm.FirstName @tm.LastName @tm.Role</td>
    if(++i % 2 == 0)
    {
        @:</tr><tr>
    }
}

Answer 2

В синтаксисе Razor вы можете использовать @: для вставки буквенного текста.

@:This allows literal text & arbitrary html 

Вы можете увидеть, как это реализовано в моем решении, опубликованном ниже.Он правильно закрывает таблицу с нужным количеством ячеек таблицы на строку.

Мне нужен был список табличных переключателей с возможностью привязки выбранного значения.

@{
   int iSelectedId = (int)ViewData["SelectedMember"];
   long iCols = 3;
   long iCount = Model.TeamMembers.Count();
   long iRemainder = iCount % iCols;                    
   decimal iDiv = iCount / repeatCols;                    
   var iRows = Math.Ceiling(iDiv);
}
<table>
  <tr>
    @for (int i = 0; i < iCount; i++)
    {
      var tm = Model.TeamMembers[i];
      <td><input type="radio" name="item" value="@(tm.Id)" @(tm.Id == iSelectedId) ? "checked=checked" : "") /> @(tm.FirstName) @(tm.LastName)) - @(tm.Role) </td> 

      if (i % iCols == iCols -1 && i < iCount - 1) 
      { 
        //The alternate syntax for adding arbitrary text/html @: 
        //was crucial in getting this to work correctly.
        @:</tr><tr>
      }
    }
    if (iRem > 0) 
    {
      <td colspan="@(iCols - iRem)">&nbsp;</td>
    }
  </tr>
</table>

Answer 3

Razor ожидает, что HTML-код, следующий за вашим кодом C #, будет заключен в пару HTML-тегов. Здесь у вас есть конечный тег первым, а начальный тег позже, поэтому бритве не удалось разобрать текст.

Включение вашего HTML-блока кода решает эту проблему, как указал Дарин.

Вы можете прочитать это краткое руководство Фила Хаакеда http://haacked.com/archive/2011/01/06/razor-syntax-quick-reference.aspx