Il modello di baffi non viene visualizzato nella tabella tbody

Question

Perché lo stesso codice oggetto JSON genera l'output con elementi ul, ma non con un tag table.

ho il mio modello di baffi come:

<div id="template-ul"> 
    <h3>{{name}}</h3> 
    <ul> 
     {{#students}} 
     <li>{{name}} - {{age}}</li> 
     {{/students}} 
    </ul> 
</div> 

<div id="template-table"> 
    <table> 
     <thead> 
      <th>Name</th> 
      <th>Age</th> 
     </thead> 
     <tbody> 
     {{#students}} 
      <tr> 
       <td>{{name}}</td> 
       <td>{{age}}</td> 
      </tr> 
     {{/students}} 
     </tbody> 
    </table> 
</div> 

ecco il codice javascript:

var testing = { 
    "name" : "student-collection", 
    "students" : [ 
     { 
      "name" : "John", 
      "age" : 23 
     }, 
     { 
      "name" : "Mary", 
      "age" : 21 
     } 
    ] 
}; 

var divUl = document.getElementById("template-ul"); 
var divTable = document.getElementById("template-table"); 

divUl.innerHTML = Mustache.render(divUl.innerHTML, testing); 
divTable.innerHTML = Mustache.render(divTable.innerHTML, testing); 

Ecco il codice a jsFiddle - http://jsfiddle.net/pRSjH/2/

Answer 1

divTable.innerHTML rendimenti this invece di corretta template . Probabilmente succede perché il browser tenta di rendere l'HTML non valido. Penso che si può mettere il modello in <script> tag per risolvere questo problema (the fiddle)

Answer 2

si può anche commento baffi tag in tbody. E la tabella sarà costruita correttamente.
Il mio modello di esempio:

<div id="template-table"> 
    <table> 
     <thead> 
      <th>Name</th> 
      <th>Age</th> 
     </thead> 
     <tbody> 
     <!--{{#students}}--> 
      <tr> 
       <td>{{name}}</td> 
       <td>{{age}}</td> 
      </tr> 
     <!--{{/students}}--> 
     </tbody> 
    </table> 
</div>