如何使用jsrender中的动态列和值呈现表格？

我有这样如何使用jsrender中的动态列和值呈现表格？

{ 
"columns": [ 
    { 
    "name": "COLUMN1", 
    "code": "c1" 
    }, 
    { 
    "name": "COLUMN2", 
    "code": "c2" 
    }, 
    { 
    "name": "COLUMN3", 
    "code": "c3" 
    }, 
    { 
    "name": "COLUMN4", 
    "code": "c4" 
    } 
], 
"rows": [ 
    { 
    "c1": 387, 
    "c2": 347.618, 
    "c3": 0, 
    "c4": 39.282, 
    }, 
    { 
    "c1": 390, 
    "c2": 3457.618, 
    "c3": 0, 
    "c4": 40.282 
    }, 
     { 
    "c1": 387, 
    "c2": 3447.618, 
    "c3": 0, 
    "c4": 39.282 
    }, 
     { 
    "c2":10, 
    "c3": 0, 
    "c4": 39.282 
    }, 
     { 
    "c1": 387, 
    "c2": 347.618, 
    "c4": 100 
    } 
] 
}

一个数据集，其中所述列的长度以及各行的长度不固定。现在我想呈现一个表格标题为column.name 行值应该可以通过列代码访问。（比如对于列COLUMN1，每行的值应该是row.c1等等）。

我已经如此地结合很多答案和jsrender一些文档，然后拿出一个解决方案如下：

任何一个可以给我一个更好的方法来做到这一点？列数组和行数组之间的唯一映射是代码字段。如果您需要更多信息，请发表评论。

P.S：我根本不能改变数据结构。

来源

2017-08-24 Parth

看起来你可以这样做：

{{for rows}} 
    <tr> 
     {{for ~root.columns ~row=#data}} 
      <td class="right">{{:~row[code]}}</td> 
     {{/for}} 
    </tr> 
{{/for}}

来源

2017-08-25 19:32:51 BorisMoore

我试过'{{：〜行[{{：代码}}]}}'但力打动我使用这种简单的形式'{{：〜行[代码]}}'。太棒了，感谢您的帮助。 – Parth

如何使用jsrender中的动态列和值呈现表格？

回答

相关问题