Làm cách nào để sử dụng các câu lệnh trong các mẫu underscore.js?

Tôi đang sử dụng chức năng tạo khuôn mẫu underscore.js và đã thực hiện một mẫu như thế này:

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

Như bạn có thể thấy tôi có một câu lệnh if trong đó bởi vì tất cả các mô hình của tôi sẽ không có tham số ngày. Tuy nhiên cách làm này mang lại cho tôi một lỗi date is not defined. Vì vậy, làm thế nào tôi có thể làm nếu các câu lệnh trong một mẫu?

Cái này cần phải dùng mẹo:

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

Hãy nhớ rằng trong các mẫu underscore.js ifvà forchỉ là cú pháp javascript tiêu chuẩn được gói trong <% %>các thẻ.

Nếu bạn thích câu lệnh ngắn hơn, bạn có thể sử dụng tốc ký này:

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

Nó có nghĩa là hiển thị id nếu hợp lệ và trống nếu không.

Tùy thuộc vào tình huống và hoặc phong cách của bạn, bạn cũng có thể muốn sử dụng in bên trong các <% %>thẻ của mình , vì nó cho phép xuất trực tiếp. Giống:

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

Và cho đoạn trích ban đầu với một số kết nối:

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

Dưới đây là một kiểm tra if / other đơn giản trong underscore.js, nếu bạn cần bao gồm kiểm tra 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>

Trả lời blackdivine ở trên (về cách sọc kết quả của một người), bạn có thể đã tìm thấy câu trả lời của mình (nếu vậy, xấu hổ vì bạn không chia sẻ!), Nhưng cách dễ nhất là sử dụng toán tử mô đun. giả sử, ví dụ, bạn đang làm việc trong một vòng lặp for:

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

Trong vòng lặp đó, chỉ cần kiểm tra giá trị của chỉ mục của bạn (i, trong trường hợp của tôi):

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

Làm điều này sẽ kiểm tra phần còn lại của chỉ mục của tôi chia cho hai (chuyển từ 1 đến 0 cho mỗi hàng chỉ mục).

Bạn có thể thử _.isUnd xác định

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

Từ đây :

"Bạn cũng có thể tham khảo các thuộc tính của đối tượng dữ liệu thông qua đối tượng đó, thay vì truy cập chúng dưới dạng các biến." Có nghĩa là đối với trường hợp của OP, điều này sẽ hoạt động (với sự thay đổi nhỏ hơn đáng kể so với các giải pháp khả thi khác):

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

Để kiểm tra giá trị null bạn có thể sử dụng _.isNulltừ tài liệu chính thức

isNull_.isNull(object)

Trả về true nếu giá trị của đối tượng là null.

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