Как получить элемент из другого массива, используя @key текущего контекста в Handlebars?

Question

У меня есть два контекста:

dow = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']

businessHours = {
    days: [
        ["08:00", "22:00"],
        ["08:00", "22:00"],
        ["08:00", "22:00"],
        false,
        ["08:00", "22:00"],
        false,
        false
    ],
    openOnHolidays: false
}

Теперь я пытаюсь отобразить каждый из businessHours.days в таблицу, где каждая строка содержит название дня из dow в одной ячейке и часыв другом.Я пытался сделать это следующим образом

{{#hours}}
<table>{{#each days}}
<tr>
    <td>{{@root.dow.[@key]}}</td> <!-- This is the line I'm talking about ->
    <td>{{#if this}}{{this.[0]}} - {{this.[1]}}{{/if}}{{#unless this}}Closed{{/unless}}</td>
</tr>
{{/each}}</table>
{{#unless openOnHolidays}}Closed on holidays{{/unless}}
{{/hours}}

Но он не отображает название дня.Я не преобразовываю businessHours.days в простой объект, потому что свойства объекта не хранятся в фиксированном порядке.

Answer 1

Это можно решить, используя Handlebar's lookup helper .

{{lookup @root.dow @key}}

См. Рабочий фрагмент ниже.

var data = {
  dow: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
  hours: {
    days: [
      ["08:00", "22:00"],
      ["08:00", "22:00"],
      ["08:00", "22:00"],
      false,
      ["08:00", "22:00"],
      false,
      false
    ],
    openOnHolidays: false
  }
};

var source = $('#entry-template').html();
var template = Handlebars.compile(source)(data);

$('body').html(template)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.12/handlebars.min.js"></script>

<script id="entry-template" type="text/x-handlebars-template">
{{#hours}}
<table>
<thead>
  <tr>
    <th>Day</th>
    <th>Hours</th>
  </tr>
</thead>
<tbody>
{{#each days}}
<tr>
    <td>{{lookup @root.dow @key}}</td>
    <td>{{#if this}}{{this.[0]}} - {{this.[1]}}{{/if}}{{#unless this}}Closed{{/unless}}</td>
</tr>
{{/each}}
</tbody>
</table>
{{#unless openOnHolidays}}Closed on holidays{{/unless}}
{{/hours}}
</script>