Hogan.js 互动版

在线工具推荐: Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编辑器

非空列表

如果person键存在,并且值为真,在#/之间的HTML则会被渲染,并且进行一次或者多次渲染。

当值为非空列表时,列表中的文本则会被遍历展示。段落的内容则会被赋予到当前的列表项的for each迭代器。通过这种方式,我们可以遍历集合。

模板 :

{{#person}}
  <b>{{name}}</b>
{{/person}}

Hash - data绑定数据:

{
  "person": [
    { "name": "resque" },
    { "name": "hub" },
    { "name": "rip" }
  ]
}

输出 - render()渲染输出:

var output = template.render(data);   
console.log(output);      
<b>resque</b>
<b>hub</b>
<b>rip</b>