Comment utiliser les instructions if dans les modèles underscore.js?

J'utilise la fonction de modèle underscore.js et j'ai créé un modèle comme celui-ci:

<script type="text/template" id="gridItem">
    <div class="griditem <%= gridType %> <%= gridSize %>">
        <img src="<%= image %>" />
        <div class="content">
            <span class="subheading"><%= categoryName %></span>
            <% if (date) { %><span class="date"><%= date %></span><% }  %>
            <h2><%= title %></h2>
        </div>
    </div>
</script>

Comme vous pouvez le voir, j'ai une instruction if car tous mes modèles n'auront pas le paramètre date. Cependant, cette façon de procéder me donne une erreur date is not defined. Alors, comment puis-je faire des instructions dans un modèle?

Cela devrait faire l'affaire:

<% if (typeof(date) !== "undefined") { %>
    <span class="date"><%= date %></span>
<% } %>

N'oubliez pas que dans les modèles underscore.js, ifil ne fors'agit que d'une syntaxe javascript standard enveloppée dans des <% %>balises.

Si vous préférez une instruction if if plus courte, vous pouvez utiliser ce raccourci:

<%= typeof(id)!== 'undefined' ?  id : '' %>

Cela signifie afficher l'id si est valide et vide s'il ne l'était pas.

Selon la situation et / ou votre style, vous pouvez également utiliser l' impression à l' intérieur de vos <% %>tags, car cela permet une sortie directe. Comme:

<% if (typeof(id) != "undefined") {
     print(id);
}
else {
    print('new Model');
} %>

Et pour l'extrait d'origine avec une concaténation:

<% if (typeof(date) != "undefined") {
    print('<span class="date">' + date + '</span>');
} %>

Voici une simple vérification if / else dans underscore.js, si vous devez inclure une vérification nulle.

<div class="editor-label">
    <label>First Name : </label>
</div>
<div class="editor-field">
    <% if(FirstName == null) { %>
        <input type="text" id="txtFirstName" value="" />
    <% } else { %>
        <input type="text" id="txtFirstName" value="<%=FirstName%>" />
    <% } %>
</div>

En répondant à blackdivine ci-dessus (sur la façon de répartir ses résultats), vous avez peut-être déjà trouvé votre réponse (si c'est le cas, honte à vous de ne pas partager!), Mais la façon la plus simple de le faire est d'utiliser l'opérateur de module. disons, par exemple, que vous travaillez dans une boucle for:

<% for(i=0, l=myLongArray.length; i<l; ++i) { %>
...
<% } %>

Dans cette boucle, vérifiez simplement la valeur de votre index (i, dans mon cas):

<% if(i%2) { %>class="odd"<% } else { %>class="even" <% }%>

Cela vérifiera le reste de mon index divisé par deux (basculer entre 1 et 0 pour chaque ligne d'index).

Vous pouvez essayer _.isUndefined

<% if (!_.isUndefined(date)) { %><span class="date"><%= date %></span><% } %>

D' ici :

"Vous pouvez également vous référer aux propriétés de l'objet de données via cet objet, au lieu d'y accéder en tant que variables." Cela signifie que pour le cas de l'OP, cela fonctionnera (avec un changement beaucoup plus petit que les autres solutions possibles):

<% if (obj.date) { %><span class="date"><%= date %></span><% }  %>

Pour vérifier les valeurs nulles que vous pouvez utiliser à _.isNullpartir de la documentation officielle

isNull_.isNull(object)

Renvoie vrai si la valeur de l'objet est nulle.

_.isNull(null);
=> true
_.isNull(undefined);
=> false