2013-09-27 51 views
0

請告訴我,如果存在嵌套數據,如何在Backbone.js中創建模板。backbone.js上的數據模板

數據例如:

var questions = [ 
    { 
     id: 0, 
    question: [ 
     { 
      id: 101, 
      text: 'What is your name?', 
     }, 
     { 
      id: 102, 
      text: 'What is your lastname?', 
     }, 
     { 
      id: 103, 
      text: 'What is yout sex?', 
     }, 
     { 
      id: 104, 
      text: 'How old are you?', 
     }, 
    ] 
} 
]; 

而對於輸出的HTML代碼:

<div id="qu_0" class="questions"><div> 
    <p><input type="radio" rel="question" name="question_0" id="i101" value="101" /><label for="i101">What is your name?</label></p> 
    <p><input type="radio" rel="question" name="question_0" id="i102" value="102" /><label for="i102">What is your firstname?</label></p> 
    <p><input type="radio" rel="question" name="question_0" id="i103" value="103" /><label for="i103">What is your sex?</label></p> 
    <p><input type="radio" rel="question" name="question_0" id="i104" value="104" /><label for="i104">How old are you?</label></p> 
    <button type="button" name="next"><b>Answer</b></button> 
</div></div> 

我明白,我應該得到的東西是這樣的:

<script id="questionTemplate" type="text/template"> 
<div> 
    <p><input type="radio" rel="question" name="question_<%= id %>" id="i<%= q.id %>" value="<%= q.id %>" /><label for="i<%= q.id %>"><%= q.text %></label></p> 
    <button type="button" name="next"><b>Answer</b></button> 
</div> 
</script> 

但我不不知道如何在模板中顯示一組嵌套的問題。請幫幫我。

回答

1

你可以通過這樣的數組循環:爲什麼用「爲......的」使用數組迭代一個壞主意]

<script id="questionTemplate" type="text/template"> 
    <% for(var question in questions) { %> 
     <div id="qu_<%= question.id %>" class="questions"><div> 
     <% for(var q in questions,question) { %> 
      <p><input type="radio" rel="question" name="question_<%= q.id %>" id="i<%= q.id %>" value="<%= q.id %>" /><label for="i<%= q.id %>"><%= q.text %></label></p> 
     <% } %> 
     </div></div> 
    <% } %> 
    <button type="button" name="next"><b>Answer</b></button> 
</script> 
+0

讀(http://stackoverflow.com/q/500504/722238) – fbynite

+0

謝謝!我用_.each()解決了這個問題: '' – FladeX

+0

@fbynite:使用「for ... in」絕不是「這樣一個壞主意「。它只是有一些好的編碼員應該知道的怪癖。在這種情況下,這些怪癖都不適用。 –