Handlebar js - JSON 对象中的第二个数组不会打印到 table

Question

我有以下内容：

handlebardemo.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="ISO-8859-1" name="viewport" content="width=device-width, initial-scale=1">
    <title>Handlebar demo - user table</title>
    <script src="lib/jquery-2.1.4.js" type="text/javascript"></script>
    <script src="lib/jquery-ui.js" type="text/javascript"></script>
    <script src="lib/handlebars-v4.0.4.js" type="text/javascript"></script>
    <script src="js/handlebar2.js" type="text/javascript"></script>
    <link rel="stylesheet" href="css/w3.css">
    <link rel="stylesheet" href="css/jquery-ui.css">
</head>
<body>
    <div id="usertable" class="w3-table-all">
        <script id="user-table-template" type="x-handlebars-template">
            <table>
                <thead>
                    <th>Username</th>
                    <th>Real Name</th>  
                    <th>Email</th>
                    <th>Group</th>
                </thead>
                <tbody>
                    {{#users}}
                        <tr>
                            <td>{{username}}</td>
                            <td>{{firstname}} {{lastname}}</td>
                            <td>{{email}}</td>
                            <td>{{group.groupname}}</td>
                        </tr>
                    {{/users}}
                </tbody>
            </table>
        </script>
    </div>
</body>
</html>

handlebar2.js

$(function(){
    var source = $("#user-table-template").html();
    var template = Handlebars.compile(source);
    var data = { users: [
          {username: "Alan87", firstname: "Alan", lastname:"Johnson", email:"alan@test.com"},
          {username: "JeffABC", firstname: "Jeff", lastname:"Beck", email:"jeff@test.com"},
          {username: "Sarah_R_1990", firstname: "Sarah", lastname:"Reilly", email:"sarah@test.com"}
          ], group: [
          {groupname:"Dev"},
          {groupname:"QA"},
          {groupname:"Dir"},
       ]}
    $("#usertable").append(template(data));
});

数据中的第一个数组 users 可以很好地打印到 table，但我似乎无法将组中的值打印到第 4 列。我对 Handlebars 语法等不是很了解，所以我可能在这里遗漏了一些明显的东西。我尝试了 <td>{{../group.groupname}}</td> 但这似乎没有任何作用，而且上面文件中概述的方法也没有奏效。我也试过 <td>{{../group}}</td> 但这在每一行的最后一列打印出 [object Object],[object Object],[object Object]

Answer 1

怎么样：

  <td>
    {{#each ../group}}
     {{groupname}}
    {{/each}}
  </td>

Handlebar js - JSON 对象中的第二个数组不会打印到 table

Handlebar js - Second array in JSON object wont print onto table

html

javascript

handlebars.js