Il formato auto VisualStudio non formatta correttamente il mio codice rasoio

Question

Sto usando @:</div> per visualizzare correttamente alcune colonne di bootstrap. Questo è il mio codice in cui lo sto usando:

var i = 0; 

<div class="container-fluid"> 
    <div class="row show-grid"> 
     @foreach (var one in Model) 
     { 

      if (i % 3 == 0) 
      { 
       @:<div class="row show-grid"> 
      } 

      <div class="one-element col-md-4"> 
       @one.Title 
      </div> 

      if ((i + 1) % 3 == 0) 
      { 
       @:</div> 
      } 

      i++; 
     } 
    </div> 
</div> 

Formatta questo (che funziona bene finché io non uso la funzione VisualStudio auto-formato):

@:</div> 

a this:

@: 
</div> 

E quindi l'applicazione non funziona più.

Come può essere risolto?

Answer 1

ho riparato utilizzando @Html.Raw() come questo:

var i = 0; 

<div class="container-fluid"> 
    <div class="row show-grid"> 
     @foreach (var one in Model) 
     { 

      if (i % 3 == 0) 
      { 
       @Html.Raw("<div class=\"row show-grid\">") 
      } 

      <div class="one-element col-md-4"> 
       @one.Title 
      </div> 

      if ((i + 1) % 3 == 0) 
      { 
       @Html.Raw("</div>") 
      } 

      i++; 
     } 
    </div> 
</div> 

Immagino che questo è buono come si arriva.

Ma se qualcuno sa di un modo più elegante per farlo, per favore fatemelo sapere.

Answer 2

E 'sembrare il problema qui è che si sta aprendo un <div> a condizione if (i % 3 == 0) ma non si sta chiudendo </div> la stessa condizioneif ((i + 1) % 3 == 0).
Ciò significa che potresti avere un'apertura <div> che non si chiude mai o una chiusura </div> che non si è mai aperta.
Può essere che si può provare questo:

var i = 0; 

<div class="container-fluid"> 
    <div class="row show-grid"> 
    @foreach (var one in Model) 
    { 
     <div class="one-element col-md-4"> 
      @one.Title 
     </div> 

     if (i % 3 == 0) 
     { 
      <div class="clear"></div> 
     } 

     i++; 
    } 
    </div> 
</div> 

Può essere questo è dove si hanno problemi! Ho aggiornato sul tuo commento. Aggiornamento sul commento @Alexei Levenkov. Sto anche guardando un modo migliore per farlo. Questa soluzione è come lo sto facendo nei miei progetti quando ho bisogno di 3 colonne per riga.

Answer 3

Ok, ho capito ora, che mi sbagliavo con <text> tag e here is why:

In Razor, i tag devono essere annidati correttamente. <text></div></text> non è nidificazione adeguata.

Il modo migliore per risolvere il tuo problema menzione per @Alexei Levenkov:

<div class="container-fluid"> 
    <div class="row show-grid"> 
     @foreach (var one in Model.Select((value, index) => new { value, index }).GroupBy(x => x.index/3)) 
     { 
      <div class="row show-grid"> 
       @foreach (var el in one.Select(x => x.value)) 
       { 
        <div class="one-element col-md-4"> 
         @el.Title 
        </div> 
       } 
      </div> 
     } 
    </div> 
</div> 

Ma, secondo this answer vostro approccio Html.Raw() è buono enought.