带胡须的HTML中的自动列表JavaScript

Question

我试图用胡子渲染简单的无序列表。

这是我的代码：

var num = 0; 

document.addEventListener("DOMContentLoaded", function(event) { 
    var template = '<ul><li>{{name}}</li></ul>'; 
    var data = {name: 'nome' + num} 

    while (num < 6) 
    { 
     num++;      
     data = {name: 'nome' + num};    

    } 

输出是：

• nome6

但我想创建自动与条件：

• nome1

• nome2

• nome3

• nome4

• nome5

• nome6

Answer 1

你的数据不是一个数组，如果你要打印的东西在您需要创建一个数组的循环在你的js中传递给模板。

查看：

{ 
    "beatles": [ 
     { "firstName": "John", "lastName": "Lennon" }, 
     { "firstName": "Paul", "lastName": "McCartney" }, 
     { "firstName": "George", "lastName": "Harrison" }, 
     { "firstName": "Ringo", "lastName": "Starr" } 
    ], 
    "name": function() { 
     return this.firstName + " " + this.lastName; 
    } 
} 

模板：

<ul> 
    {{#beatles}} 
     <li>{{name}}</li> 
    {{/beatles}} 
</ul>