How To: Handlebars - Create Table element
Here is a Handlebars template for creating a table element based on any array of JSON objects:
<table>
<thead>
<tr>
{{#each array.[0]}}
<th>{{@key}}</th>
{{/each}}
</tr>
</thead>
<tbody>
{{#each array}}
<tr>
{{#each this}}
<td>{{this}}</td>
{{/each}}
</tr>
{{/each}}
</tbody>
</table>
- {{#each array.[0]}} gets the first JSON object in the array and iterates over the object's attributes.
- {{@key}} renders the object's attribute name.
- {{#each array}} iterates over each JSON object in the array.
- {{#each this}} iterates over each attribute in the current object.
- {{this}} renders the value for the current attribute.