handlebars 怎么遍历一个二维表,比如象mongodb中取出来的数据
比如数据是这种
var data={list:[ {name:'xxx' ,age:11 },
{name:'yy' ,age:22 },
{name:'z' ,age:33}
]};
用模板
<ul class="data_list">
{{#each data}}
<li>{{#each this}}
<dt> {{name}} }</dt> <dd> {{age}} </dd>
{{/each}}
</li>
{{/each}}
</ul>
这样数据遍历对了,但是没显示出来
4 回复
为什么还要each第二次呢,each针对数组,如果是json直接调用属性不就可以吗
mongodb中取出来的字段名字不一定全都一样 比如
var data={list:[ {name:'xxx' ,age:11 },
{no:'yy' ,age:22 },
{sql:'z' ,version:33}
]};
有两个方法解决不定的属性名字
-
重写物件属性
data.newList=[]; data.list.forEach(function(k){ temp=[] for (var prop in k){ if (k.hasOwnProperty(prop)){ temp.push({ ‘key’ : prop, ‘value’ : k[prop] }); } } data.newList.push(temp); }); 模板
<ul class=“data_list”> {{#with newList}} {{#each this}} <li> {{#each this}} <dt> {{key}} }</dt> <dd> {{value}} </dd> {{/each}} </li> {{/each}} {{/with}} </ul>
如果不需要key的话
data.newList=[];
data.list.forEach(function(k){
var temp={};var i=1;
for (var prop in k){
if (k.hasOwnProperty(prop)){
temp['value'+i]=k[prop];
}
i++;
}
data.newList.push(temp);
});
模板
<ul class="data_list">
{{#with newList}}
{{#each this}}
<li>
{{#with this}}
<dt> {{value1}} }</dt> <dd> {{value2}} </dd>
{{/with}}
</li>
{{/each}}
{{/with}}
</ul>
2.使用自己的helper,详细请查看来源
@yakczh 同意下面的方法