有這么一個(gè)需求,在一個(gè)table中,tr是通過(guò)each取值,
取出的值要與table標(biāo)題相對(duì)應(yīng),如何實(shí)現(xiàn)?例如:
<table> <thead> <tr> {{#each 標(biāo)題集合,值舉例[name,sex...]}} {{this}} {{/each}} 得到結(jié)果應(yīng)是 <th>name</th> <th>sex</th> </tr> </thead> <tbody> {{#each 內(nèi)容集合,值舉例[{name:’蘇軾’,sex:’男’},{name:’李清照’,sex:’女’}...]}} 此時(shí)我想得到這樣的數(shù)據(jù),與標(biāo)題想對(duì)應(yīng),該如何做呢? <tr> <td>蘇軾</td> <td>男</td> </tr> <tr> <td>李清照</td> <td>女</td> </tr> {{/each}} </tbody> </table>
如果在JS中,我們可以通過(guò)list[key]的方式取值,但是handlebars
好像不支持這種方式,不知道是不是我自己沒(méi)整明白
總之資料了找了半天,也沒(méi)有找到合適的解決方案,于是乎,自己寫(xiě)吧,很簡(jiǎn)單。
Handlebars.registerHelper("getValueByKeyFromList", function(list, key, options){
if(list && key && list[key]){
return list[key];
}
return;
});
應(yīng)用到上面table中就是
{{#each 內(nèi)容集合,值舉例[{name:’蘇軾’,sex:’男’},{name:’李清照’,sex:’女’}...]}} 此時(shí)我想得到這樣的數(shù)據(jù),與標(biāo)題想對(duì)應(yīng),該如何做呢? <tr> {{#each 標(biāo)題集合,值舉例[name,sex...]}} <td>{{getValueByKeyFromList ../this this}}</td> ../this 意為上一層集合的當(dāng)前值 this 意為當(dāng)前集合的當(dāng)前值 {{/each}} </tr> {{/each}}
有需要的朋友可以照著這方法試試,希望能幫到大家
【 微信掃一掃 】