Underscore.js模板循環迭代

Question

我有一個模式下面的模板

<div class="ui-modal"> 
    <div class="mask"></div> 
    <div class="ui-modal-container"> 
    <div class="ui-modal-header"> 
     <h3><%= modal['title'] %></h3> 
    </div> 
    <div class="ui-modal-text"> 
     <p><%= modal['description'] %></p> 
    </div> 
    <% if (modal['buttons'] !== 'undefined') { %> 
     <div class="ui-button-container"> 
     <a class="ui-button ui-button-pill <%= modal['buttons'][0]['extra_class'] %> " href="<%= modal['buttons'][0]['href'] %>"> 
      <span class="label"> 
      <span class="section"><%= modal['buttons'][0]['label'] %></span> 
      </span> 
     </a> 
     </div> 
    <% } %> 
    </div> 
</div> 

，這是我想用填充它的數據：

_data = { 
"modal" : { 
    "title" : "Your address is:", 
    "description" : "Some desc here", 
    "buttons" : [ 
     {'extra_class': 'small left', 'href' : '#register/3', 'label' : 'Back'}, 
     {'extra_class': 'small center', 'href' : '#register/4', 'label' : 'Next'}, 
     {'extra_class': 'small right', 'href' : '#', 'label' : 'Reset'} 
    ] 
    } 
} 

我想實現的是一個iteretaion，其中我對中的索引（0）進行了「硬編碼」％=模態['按鈕'] [0] ['extra_class']％>。我認爲這是一個簡單的問題，但不幸的是，我可以找到任何可以應用於我的案例。

任何幫助將不勝感激！

謝謝！

Answer 1

在Underscore模板中的<% ... %>裏面的東西就是JavaScript。這意味着，你可以數組遍歷你會在其他地方以同樣的方式：for -loops，_.each，forEach，...

典型下劃線上下的辦法是：

​​

你也可以使用簡單for -loop：

<% if(modal['buttons']) { %> 
    <div class="ui-button-container"> 
    <% for(var i = 0; i < model.buttons.length; ++i) { %> 
     <a class="ui-button ui-button-pill <%= model.buttons[i].extra_class %> " href="<%= model.buttons[i].href %>"> 
     <span class="label"> 
      <span class="section"><%= model.buttons[i].label %></span> 
     </span> 
     </a> 
    <% } %> 
    </div> 
<% } %>