Каким будет правильный синтаксис Razor, содержащий условную логику

Я хочу показать 3 элемента в строке в файле бритвы. Мне нужно добавить div class="row" и закрывающий тег для каждых 3 элементов. Ниже моя лучшая попытка:

@{

  int maxInRow = 3;
  int counter = 1;

  <div class="main">

  @foreach(var item in allItems)
  {

    if(counter == 1)
    {
        <div class="row">
    }

    <div class="article">Here is the article.</div>

    @{counter++;}
    if(counter == maxInRow)
    {
        counter = 1;
        </div>
    }

  </div>
}

Каким будет правильный синтаксис Razor?


c# razor
person Nime Cloud    schedule 18.12.2014    source источник
comment
Вы получаете какие-либо ошибки?   -  person Captain Kenpachi    schedule 18.12.2014

Ответы (2)


arrow_upward
1
arrow_downward

Я думаю, вы можете реализовать, используя приведенный ниже код:

@{
   <div class="main">
       @for (int i = 0; i < allItems.Count; i += 3)
       {
          <div class="row">
              @for (int j = i; j < i + 3 && j < allItems.Count; j++)
              {
                <div class="article">Here is the article. @allItems[j]</div>
              }
          </div>
        }
   </div>            
  }

Прокомментируйте, если это не работает.

person Saket    schedule 18.12.2014
comment
Мне нужны i и J в качестве счетчиков, поэтому я выбрал это как ответ. - person Nime Cloud; 19.12.2014

arrow_upward
3
arrow_downward

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

var itemsInGroupsOf3 = allItems.Select((item, i) => new { Index = i, Item = item })
                               .GroupBy(i => i.Index / 3);

foreach(var group in itemsInGroupsOf3)
{
    var groupItems = group.Select(g => g.Item);

    <div class="row">
        @foreach(var item in groupItems)
        {
            <div class="article">Here is the article.</div>
        }
    </div>
}
person Davor Zlotrg    schedule 18.12.2014
comment
Гораздо лучший подход, чем условный HTML (который подвержен ошибкам и сложен в обслуживании). - person Gone Coding; 18.12.2014