javascript - 从 2 个数组渲染表格

Question

我有 2 个数组。一个带有想要的表列scheme = ['username', 'email', 'created']; 第二个带有数据：

data = [{ username: "...", email: "...", created: '...', gender: '...' }, {...} ...];

我想呈现这样的表格：

username     email     created
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...
...          ...       ...

我在节点中使用带有 express 的车把。

Answer 1

我做的 ：）。关键是使用车把助手。写一个助手真的很容易。所以这是我的：

var hbs = require('hbs');

hbs.registerHelper('getByKey', function(data,key) {
    return data[key];
});

（不要忘记，我在 nodejs 中）。

因此，在我拥有助手并拥有充满对象的数据数组并且我知道我想要的属性的名称之后是结束代码：

<h1>List data</h1>

    <table class="table" border="1">
        <thead>
            <tr>
                <td><b>id</b></td>
                {{#each scheme.listDisplay}}
                    <td><b>{{this}}</b></td>
                {{/each}}
            </tr>
        </thead>

        {{#each data}}
        <tr>
            <td>
                {{id}}
            </td>

            {{#each ../scheme.listDisplay}}
                <td>{{#getByKey ../data this}}{{/getByKey}}</td>
            {{/each}}

        </tr>
        {{/each}}
    </table>

Answer 2

这应该适合你。只需将此脚本插入您希望表格所在的任何位置。

var header = ["Column 1", "Column 2", "Column 3"];
var content = [["blah", "blah", "blah"],["ha","ha","ha"]];

document.write("<tr>");
for (i=0;i<header.length;i++) {
    document.write("<td>"+header[i]+"</td>");
}
document.write("</tr>");

for (i=0;i<content.length;i++) {
    document.write("<tr>");
    for (f=0;f<content.length;i++) {
        document.write("<td>"+content[i][f]+"</td>");
    }
    document.write("</tr>");
}