如何使用当前上下文从另一个数组中获取元素是@key in 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 呈现为 table，每一行在一个单元格中包含来自 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>

如何使用当前上下文从另一个数组中获取元素是@key in Handlebars？

How do I get an element from other array using current context's @key in Handlebars?

templating-engine

node.js

handlebars.js