web-dev-qa-db-fra.com

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

J'utilise la fonction de modélisation underscore.js et 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 constater, une instruction if est présente car tous mes modèles ne disposent pas du paramètre date. Cependant cette façon de faire me donne une erreur date is not defined. Alors, comment puis-je faire si des déclarations dans un modèle?

javascripttemplatesbackbone.jsunderscore.js
236
Joel

Cela devrait faire l'affaire:

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

N'oubliez pas que dans les modèles underscore.js, if et for ne sont que la syntaxe javascript standard, encapsulée dans les balises <% %>.

438
soldier.moth

Si vous préférez une déclaration plus courte si else, vous pouvez utiliser ce raccourci:

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

Cela signifie afficher l'id si est valide et vide si ce n'était pas le cas.

78
TonyTakeshi

Selon la situation et/ou votre style, vous pouvez également utiliser print dans vos balises <%%>, car cela permet une sortie directe. Comme:

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

Et pour le fragment de code original avec une concaténation:

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

Voici un simple if/else check dans underscore.js, si vous devez inclure un contrôle null.

<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>
9
Yasser

En répondant à blackdivine ci-dessus (sur la manière de rayer ses résultats), vous avez peut-être déjà trouvé votre réponse (si c'est le cas, vous devriez avoir honte de ne pas partager!), Mais le moyen le plus simple de le faire est d'utiliser l'opérateur de module. par exemple, 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 (basculement entre 1 et 0 pour chaque ligne d'index).

5
Snowmonkey

Vous pouvez essayer _. IsUndefined

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

De ici :

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

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

Pour vérifier les valeurs NULL, vous pouvez utiliser _.isNull de documentation officielle

isNull_.isNull(object)

Renvoie true si la valeur de object est null.

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