Wie verwende ich if-Anweisungen in Vorlagen von underscore.js?

Ich verwende die Vorlagenfunktion underscore.js und habe eine Vorlage wie die folgende erstellt:

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

Wie Sie sehen, habe ich dort eine if-Anweisung, da nicht alle meine Modelle den Datumsparameter haben. Diese Vorgehensweise gibt mir jedoch einen Fehler date is not defined. Wie kann ich also Anweisungen in einer Vorlage ausführen?

Dies sollte den Trick tun:

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

Denken Sie daran , dass in Underscore.js Vorlagen ifund forsind nur Standard - JavaScript - Syntax in gewickelt <% %>Tags.

Wenn Sie eine kürzere if else-Anweisung bevorzugen, können Sie diese Kurzform verwenden:

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

Dies bedeutet, dass die ID angezeigt wird, wenn sie gültig ist, und leer, wenn dies nicht der Fall ist.

Abhängig von der Situation und / oder Ihrem Stil möchten Sie möglicherweise auch Drucken in Ihren <% %>Tags verwenden, da dies eine direkte Ausgabe ermöglicht. Mögen:

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

Und für das Original-Snippet mit etwas Verkettung:

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

Hier ist eine einfache if / else-Prüfung in underscore.js, wenn Sie eine Nullprüfung einschließen müssen.

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

Als Sie oben auf blackdivine geantwortet haben (wie man die Ergebnisse streift), haben Sie möglicherweise bereits Ihre Antwort gefunden (wenn ja, schämen Sie sich dafür, dass Sie nicht teilen!), Aber der einfachste Weg, dies zu tun, ist die Verwendung des Modul-Operators. Angenommen, Sie arbeiten in einer for-Schleife:

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

Überprüfen Sie innerhalb dieser Schleife einfach den Wert Ihres Index (in meinem Fall i):

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

Dadurch wird der Rest meines Index durch zwei geteilt (zwischen 1 und 0 für jede Indexzeile umgeschaltet).

Sie können _.isUndefined ausprobieren

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

Von hier aus :

"Sie können auch über dieses Objekt auf die Eigenschaften des Datenobjekts verweisen, anstatt als Variablen darauf zuzugreifen." Dies bedeutet, dass dies für den Fall von OP funktioniert (mit einer wesentlich geringeren Änderung als bei anderen möglichen Lösungen):

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

Um nach Nullwerten zu suchen, können Sie diese _.isNullaus der offiziellen Dokumentation verwenden

isNull_.isNull(object)

Gibt true zurück, wenn der Wert des Objekts null ist.

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