How do I access object keys in Handlebars templates?

Question

I'm passing this into my template.

modules: {
  left: [],
  center: ['card', 'progressChart', 'tableOfChildren'],
  right: ['activity', 'details', 'triggers']
}

I want to do something like this... (psuedo code that I don’t think will work)

{{#each region in modules}}
  <div class="{{region}}">
  {{#each region}}
    <div class="{{this}} module"></div>
  {{/each}}
  </div>
{{/each}}

Answer 1

You can do

{{#each modules}}
  <div class="{{@key}}">
  {{#each this}}
    <div class="{{this}} module"></div>
  {{/each}}
  </div>
{{/each}}

Reference: http://handlebarsjs.com/builtin_helpers.html#iteration

Answer 2

Probably duplicate, where Jon provides the best solution:

For arrays:

{{#each myArray}}
    Index: {{@index}} Value = {{this}}
{{/each}}

For objects:

{{#each myObject}}
    Key: {{@key}} Value = {{this}}
{{/each}}

Note that only properties passing the hasOwnProperty test will be enumerated.