javascript - ¿Cómo usar las sentencias if en las plantillas de underscore.js?

templates backbone.js

Question

Estoy usando la función de plantillas underscore.js y he hecho una plantilla como esta:

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

Como puede ver, tengo una declaración if allí porque todos mis modelos no tendrán el parámetro de fecha. Sin embargo, esta forma de hacerlo me da una date is not defined error date is not defined . Entonces, ¿cómo puedo hacer si las declaraciones dentro de una plantilla?

Answer 1

Aquí hay un simple if / else check en underscore.js, si necesita incluir un cheque nulo.

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

Answer 2

Dependiendo de la situación y / o su estilo, también puede usar print dentro de sus etiquetas %> %% %> , ya que permite la salida directa. Me gusta:

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

Y para el fragmento original con alguna concatenación:

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

Answer 3

Desde here

"También puede referirse a las propiedades del objeto de datos a través de ese objeto, en lugar de acceder a ellos como variables". Lo que significa que para el caso de OP esto funcionará (con un cambio significativamente menor que otras soluciones posibles):

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

Answer 4

Esto debería funcionar:

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

Recuerde que en las plantillas de underscore.js if y for solo son sintaxis javascript estándar envueltas en etiquetas <% %> %% <% %> .

Answer 5

Para verificar los valores nulos, puede usar _.isNull de la documentación oficial

isNull_.isNull(object)

Devuelve verdadero si el valor del objeto es nulo.

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

Answer 6

Puedes probar _.isUndefined

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

Answer 7

Respondiendo a blackdivine arriba (acerca de cómo marcar los resultados de uno), es posible que ya hayas encontrado tu respuesta (si es así, ¡qué vergüenza por no compartir!), Pero la forma más sencilla de hacerlo es utilizar el operador de módulo. Digamos, por ejemplo, que estás trabajando en un bucle for:

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

Dentro de ese bucle, simplemente verifique el valor de su índice (i, en mi caso):

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

Al hacer esto, se verificará el resto de mi índice dividido por dos (alternando entre 1 y 0 para cada fila de índice).

Answer 8

Si prefieres una declaración más corta, si no, puedes usar esta abreviatura:

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

Significa mostrar el id si es válido y en blanco si no lo fue.