有这么一个需求,在一个table中,tr是通过each取值,取出的值要与table标题相对应,如何实现?例如:

<table>
<thead>
<tr>
    {{#each 标题集合,值举例[name,sex...]}}
      {{this}}
    {{/each}}
得到结果应是
<th>name</th>
<th>sex</th>
</tr>
</thead>
 <tbody>
  {{#each 内容集合,值举例[{name:'苏轼',sex:'男'},{name:'李清照',sex:'女'}...]}}
此时我想得到这样的数据,与标题想对应,该如何做呢?
<tr>
<td>苏轼</td>
<td>男</td>
</tr>
<tr>
<td>李清照</td>
<td>女</td>
</tr>
{{/each}}
 </tbody>
</table>

如果在JS中,我们可以通过list[key]的方式取值,但是handlebars好像不支持这种方式,不知道是不是我自己没整明白

总之资料了找了半天,也没有找到合适的解决方案,于是乎,自己写吧,很简单。

Handlebars.registerHelper("getValueByKeyFromList", function(list, key, options){
if(list && key && list[key]){
return list[key];
}
return;
});

应用到上面table中就是

{{#each 内容集合,值举例[{name:'苏轼',sex:'男'},{name:'李清照',sex:'女'}...]}}
此时我想得到这样的数据,与标题想对应,该如何做呢?
<tr>
{{#each 标题集合,值举例[name,sex...]}}
<td>{{getValueByKeyFromList ../this this}}</td>
../this 意为上一层集合的当前值
this 意为当前集合的当前值
{{/each}}
</tr>
{{/each}}

解决。

Handlebars.js中集合(list)通过中括号的方式取值的更多相关文章

  1. Handlebars.js 中文文档

    Home  »  前端   »   Handlebars.js 中文文档 Handlebars.js 中文文档 Posted in 前端 By KeenWon On 2014年4月3日 Views:  ...

  2. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  3. JavaScript学习12 JS中定义对象的几种方式【转】

    avaScript学习12 JS中定义对象的几种方式 转自:  http://www.cnblogs.com/mengdd/p/3697255.html JavaScript中没有类的概念,只有对象. ...

  4. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  5. js中声明Number的五种方式

    转载自:http://www.jb51.net/article/34191.htm <!DOCTYPE html> <html> <head> <meta c ...

  6. js中定义变量的三种方式const,val,let 的区别

    js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始 ...

  7. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

  8. js 定义像java一样的map方便取值【转】

    js 定义像java一样的map方便取值.  百度有位大神说"js对象本身就是一种Map结构",这真是一段让人欢天喜地的代码. <script> //定义一个全局map ...

  9. 在LoadRunner中从数组类型的参数随机取值的方法

    在LoadRunner中从数组类型的参数随机取值的方法 使用web_reg_save_param做关联后,有时候会有多个匹配值. 为了模仿用户行为随机取一个值为后续transcation所用,可以使用 ...

随机推荐

  1. python-wsgi测试服务器

    #!/usr/bin/python from wsgiref.simple_server import make_server def application(environ,start_respon ...

  2. centos6 vps部署rails

    centos 6 vps初始化部署rails应用1 ssh登录 vpsssh -p port root@server_ip_address 2 添加用户 adduser usernamepasswd ...

  3. InnoDB的视图

    视图(View)是一个命名的虚表,它由一个查询来定义,可以当做表使用.与持久表(permanent table)不同的是,视图中的数据没有物理表现形式. 视图的作用 视图在数据库中发挥着重要的作用.视 ...

  4. @Controller 和 @RestController 区别

    @Controller 用于标识为spring MVC的controller @RestController 是一个便利的注解,加了这个注解就相当于加了@Controller 和 @ResponseB ...

  5. 分层 DAO层,Service层,Controller层、View层

    前部分摘录自:http://blog.csdn.net/zdwzzu2006/article/details/6053006 DAO层:DAO层主要是做数据持久层的工作,负责与数据库进行联络的一些任务 ...

  6. 注解完成spring json返回数据格式配置

    import com.fasterxml.jackson.databind.ObjectMapper;import com.fasterxml.jackson.databind.module.Simp ...

  7. DataGridView 隔行显示不同的颜色

    两种方法 第一种 DataGridview1.Rows[i].DefultCellStyle.backcolor 第二种 AlternatingRowsDefutCellstyle 属性 获取或设置应 ...

  8. 使用重绘项美化WinForm中的控件

    如果你觉得项目中的ComboBox.ListBox或其它的Winforms控件不能满足你的显示要求,包括窗体在内很多控件都支持重绘修改显示样式.下面的示例完成对ComBox数据项的重绘,希望能起到抛砖 ...

  9. msql查询指定日期

    今天 select * from 表名 where to_days(时间字段名) = to_days(now()); 昨天 SELECT * FROM 表名 WHERE TO_DAYS( NOW( ) ...

  10. SQL Server 中位数、标准差、平均数

    create table examines ( ,) NOT NULL, ) NULL, [ph_score] [int] NULL ) SELECT dept_name, AVG(sp) as '中 ...