这是一个需要递归的对象。
目的
var obj = [
{
obj: true,
key: 'a',
value: [
{
obj: false,
key: 'a',
value: 1
},
{
obj: false,
key: 'b',
value: 2
},
{
obj: true,
key: 'c',
value: [
{
obj: false,
key: 'a',
value: 3
}
]
}
]
},
{
obj: false,
key: 'b',
value: 4
}
];
模板(recursion.html)。
<!-- root -->
<ul>
{{#value}}
<li>
<!-- object -->
{{#obj}}
<span><b>{{key}}</b></span>
{{>object}}
{{/obj}}
<!-- value -->
{{^obj}}
<span><b>{{key}}</b> <span>{{value}}</span></span>
{{/obj}}
</li>
{{/value}}
</ul>
您传入的第一个对象是根,它key
不仅有一个value
. 如果value
有一个属性obj
设置,true
那么它是一个对象,打印出它的键并再次递归调用模板以获得它的值。如果不是对象,则不需要递归,只需打印出来。
渲染客户端。
// html is recursion.html contents
var template = Hogan.compile(html),
content = template.render({value: obj}, {object: html});
// show the rendered template
$('body').empty().append(content);
使用 Express.js 渲染服务器端
res.render('recursion', {
value: obj,
partials: {
object: 'recursion'
}
});
这个例子的输出
顺便说一句,我正在使用 Hogan.js 来呈现模板。我不知道 Mustache.js 渲染是否支持递归。