Razor синтаксис: проблема с выяснением вложенных операторов и области видимости переменной

Question

У меня проблемы с выяснением синтаксиса Razor и с тем, как работает переменная область видимости.Я новичок в C # в целом, а также синтаксис Razor.Вот некоторый код, который я создал параллельно, что я хочу сделать, просто немного проще.

У меня есть массив, представленный ViewBag.Photos, который я хочу повторить, хотя и отображать в своем коде пользовательского интерфейса.Однако для первой фотографии мне нужно добавить отличительный вторичный класс с именем active для моего кода пользовательского интерфейса (с помощью плагина jquery), чтобы он отображался правильно, так как ему необходимо знать, что такое первая фотография.я делаю неправильно, и как лучше всего это сделать?

<div class="foo">
    @{int i = 1;}
    @foreach (var photo in ViewBag.Photos) 
    {
        if (i == 1) { 
            <div class="item active">
        } 
        else {
            <div class="item">
        }
        <img src="@photo" alt="@ViewBag.SomeVar">
        <div class="bar">
            <p>Test</p>
        </div>
        </div>
        @{i++};
    }
</div>

Answer 1

<div class="foo">
    @{
          int i = 1;
          @foreach (var photo in ViewBag.Photos) 
          {
             if (i++ == 1) { 
               <div class="item active">
             } 
             else {
               < div class="item">
             }
             <img src="@photo" alt="@ViewBag.SomeVar">
             <div class="bar">
                <p>Test</p>
             </div>
             </div>

       }
    }
</div>

или

    <div class="foo">
    @{
          int i = 1;
          var className = "item";
          @foreach (var photo in ViewBag.Photos) 
          {
             className = i++ == 1 ? "item active" : "item";
             <div class="@className">
                   <img src="@photo" alt="@ViewBag.SomeVar">
                   <div class="bar">
                       <p>Test</p>
                  </div>
             </div>

       }
    }
</div>

Answer 2

Вы должны использовать оператор for, а не foreach.

<div class="foo"> 
@for(int i = 0; i < ViewBag.Photos.Count; i++)  
{ 
    <div class="@((i == 0) ? "item active" : "item")">
        <img src="@ViewBag.Photos[i].Photo" alt="@ViewBag.Photos[i].AltText"> 
        <div class="bar"> 
            <p>Test</p> 
        </div> 
    </div> 
} 
</div> 

Я предполагаю, что Photos - это массив некоторого класса, который оборачивает как фотографию, так и альтернативный текст.Если нет, вы бы сделали что-то вроде этого:

<img src="@ViewBag.Photos[i]" alt="@ViewBag.AltText[i]"> 

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

ОБНОВЛЕНИЕ: Я написал бы код, как указано выше, используя условный оператор.Я думаю, что легче читать и меньше сбивать с толку.