Handlebars模板:将多个数组中的值打印到一个表中

Handlebars Template: Print values from multiple arrays into a table

本文关键字：一个 打印 模板 Handlebars 数组      更新时间：2023-09-26

我正在尝试将多个数组打印到一个表中。数据包含在两个数组中，它就像一个名称-值对。我不确定车把语法，所以任何帮助都很感激

Javascript中的数组如下：keys=｛"姓名"、"年龄"、"地址"｝；values=｛"AD"、"2"、"123st"｝；

车把（1.0版rc2）模板如下所示，但似乎没有打印任何内容。有什么提示吗？

<table>
    {{#each keys}}
        <tr>
            <td> {{keys.@index}}</td>
            <td> {{values.@index}} </td>
        </tr>
    {{/each}}
</table>

请注意，问题中的数组不是有效的JavaScript语法，应该用方括号代替大括号（例如，["name", "age", "address"]）。

我认为您的数据结构可以改进，我建议将这两个字符串数组合并为一个对象：

{
    name: 'AD',
    age: '2',
    address: '123st'
}

我们可以创建一个新的模板来迭代对象中的每个属性，并且我们可以使用Handlbars的内置{{@key}}:访问密钥

<script id="Template1" type="text/x-handlebars-template">
    <table>
        {{#each this}}
            <tr>
                <td>{{@key}}</td>
                <td>{{this}}</td>
            </tr>
        {{/each}}
    </table>
</script>

如果出于某种原因，您必须坚持使用这两个数组，我们可以使用Handlebars的查找助手来访问values数组上的require属性：

<script id="Template2" type="text/x-handlebars-template">
    <table>
        {{#each keys}}
            <tr>
                <td>{{this}}</td>
                <td>{{lookup ../values @index}}</td>
            </tr>
        {{/each}}
    </table>
</script>
相关文章：