如何访问Handlebars中嵌套循环中的数据

Question

我有如下数据，其中keyPairs是表的动态列，data是行数据。

keyPairs: {
"key0":"Value0",
"key1":"Value1",
...
}
data:[
{
"name":"name0",
"key0":"Value0",
"key1":"---",
},
{
"name":"name1",
"key0":"---",
"key1":"Value1",
}]

keyPairs对象是动态创建的，data数组中每个对象中使用的键与keyPairs中的键相同。我无法从keyPairs中获取每个data项目和每个@key的值。

{{#each data as | row |}}
<td>
{{row.name}}
</td>
{{#each ../keyPairs}}
<td>
{{./row[@key]}}
</td>
{{/each}}
{{/each}}

Answer 1

我看到了一些问题。

首先，您正在尝试使用./row从#each中提升上下文级别。然而，正确的语法是两个点，../row。

其次，当您提升上下文级别时，通过使用../row，您正试图访问父上下文上的row属性。但是父级不具有row属性，因为父级是的row对象。因此，正确的参考应该是..而不是../row。

第三，Handlebars不支持使用方括号进行动态键评估。您需要使用查找辅助对象{{lookup .. @key}}来执行此评估。

我制作了一把小提琴供你参考。

Answer 2

首先，感谢@76484的回复。第二，我自己得到了答案，和他给出的答案很相似。我用以下语法解决了我的问题。

{{#each data as | row |}}
<td>
{{row.name}}
</td>
{{#each ../keyPairs}}
<td>
{{lookup row @key}}
</td>
{{/each}}
{{/each}}