Alors que Microsoft a créé quelques rendu automatique des attributs html dans razor MVC4, il m'a fallu pas mal de temps pour trouver comment rendre une seconde classe css sur un élément, en fonction d'une expression conditionnelle de razor. J'aimerais le partager avec vous.
Sur la base d'une propriété de modèle @Model.Details, je veux afficher ou masquer un élément de liste. S'il y a des détails, un div doit être affiché, sinon, il doit être caché. En utilisant jQuery, tout ce que je dois faire est d'ajouter une classe show ou hide, respectivement. Pour d'autres raisons, je veux également ajouter une autre classe, "details". Donc, mon balisage devrait être le suivant :
<div class="details show">[Details]</div> o <div class="details hide">[Details]</div>
Ci-dessous, je montre quelques tentatives ratées (le balisage résultant suppose qu'il n'y a pas de détails).
Ceci : <div @(@Model.Details.Count > 0 ? "class=details show" : "class=details hide")> ,
rendra ceci : <div class="details" hide=""> .
Ceci : <div @(@Model.Details.Count > 0 ? "class=\"details show\"" : "class=\"details hide\"")> .
rendra ceci : <div class=""details" hide"=""> .
Ceci : <div @(@Model.Details.Count > 0 ? "class='details show'" : "class='details hide'")>
rendra ceci : <div class="'details" hide'=""> .
Aucun de ces éléments n'est une majoration correcte.
