2014-05-15 12 views
8

Come si esegue il rendering condizionale di un elemento HTML in Razor 2?ASP.NET MVC Rendering condizionale del rasoio un elemento

Per esempio, supponiamo che ho avuto il tag

<div class="someclass"> 
     <p>@somevalue</p> 
    </div> 

e ho voluto sopprimere la < -div-> tag dal rendering se il valore di @somevalue è stato pari a 1. C'è un modo semplice per farlo in Razor simile a come avrei potuto "nascondere" il < -div-> tag con Knockout.js in un browser, dove potrei:

<div class="someclass" data-bind="showWhenTrue: someValue != 1"> 
     <p data-bind="text: someValue"></p> 
    </div> 

al momento, la migliore alternativa Razor che ho è quello A fare questo:

 @if (someValue != 1) { 
     <div class="someclass"> 
       <p>@somevalue</p> 
     </div> 
     } 

risposta

10

Ci sono molti modi per farlo. Innanzitutto, è importante notare che il codice knockout in realtà non rimuove l'html dall'output, ma imposta semplicemente la visualizzazione su hidden.

Il codice del rasoio in realtà rimuove il codice dall'HT reso, quindi è una cosa molto diversa.

Per rispondere alla tua domanda, dobbiamo sapere che cosa stai cercando di raggiungere. Se si desidera solo per nascondere il display, si può semplicemente fare qualcosa di simile:

<div class="someclass" style="display: @{ somevalue == 1 ? @:"hidden" : @:"block" };"> 
    <p>@somevalue</p> 
</div> 

Si potrebbe anche fare con una classe:

<div class="someclass @{ somevalue == 1 ? @:"HideMe" : @:"ShowMe" }"> 
    <p>@somevalue</p> 
</div> 

Se si desidera rimuovere il codice dall'uscita , quindi puoi semplicemente fare ciò che hai fatto .. Sono sicuro che ciò che trovi così discutibile ... ma se vuoi altre alternative, potresti creare un helper HTML, potresti usare un aiutante per il rasoio, tu potrebbe utilizzare un Display o EditorTemplate ....

L'elenco è in realtà piuttosto lungo e io sono solo s crimpare la superficie ...

+1

Ho fatto in questo modo: @ (string.IsNullOrEmpty (somevalue)? "hideme": "") – user18539

+1

ciò che è discutibile è che @ (...) a volte elimina l'auto-formattazione per l'intero documento e intellisense per il resto del contenuto del tag. knockoutjs ha data-bind = "if: someBoolean" e angular has * ngIf = "someBoolean". Mi sarei aspettato che il rasoio avesse qualcosa di incorporato lungo queste linee per aiutarci a mantenere il nostro mark-up pulito –

Problemi correlati