javascript - Mustache.js 获取数组的当前索引

Question

在初始页面加载时，我们正在加载一个带有新闻提要的大型 json 数据对象。我们正在使用 Mustache.js 并列出所有新的提要标题，效果很好。

我们有一个 div 区域来显示 onClick 新闻项的详细信息。由于我们已经加载了数据，我需要传递当前项目的索引（数组索引）来获取我们需要从中获取详细信息的新闻项目。

{{#Data}}
    <li>
       {{eventName}}<br />
       {{eventLocName}}<br />
       {{eventLocCity}}, {{eventLocST}}
    </li>
{{/Data}}

我想添加一个 id 到

使用数组索引，例如

{{#Data}}
    <li id='{{Data.index}}'>
       {{eventName}}<br />
       {{eventLocName}}<br />
       {{eventLocCity}}, {{eventLocST}}
    </li>
{{/Data}}

将数组索引放入我的 Mustache.js 模板的语法是什么？

更新/工作

进入resultsDOM 后，我使用以下 JS 将 ' index' 添加到每个数组项中。（在代码帮助下选择答案）

for (i in result)
result[i].index = i;

Answer 1

对不起...我认为您需要手动添加索引：

for (i in Data)
   Data[i].index = i;

和

{{#Data}}
    <li id='{{index}}'>
       {{eventName}}<br />
       {{eventLocName}}<br />
       {{eventLocCity}}, {{eventLocST}}
    </li>
{{/Data}}

Answer 2

据我所知，你不能用 Mustache.js 做到这一点，但你可以用 Handlebars.js 做到这一点，它基本上扩展了 Mustaches 的功能。

您可以简单地导入 handlebars.js 而不是 mustache.js （因为它使用相同的语法并具有相同的功能但有一些额外的）然后执行

{{#each Data}}
    <li id='{{@index}}'>
       {{eventName}}<br />
       {{eventLocName}}<br />
       {{eventLocCity}}, {{eventLocST}}
    </li>
{{/each}}

免责声明：我远非专家，所以如果您得到更好的答案，我不会感到惊讶。

Answer 3

一些 Mustache 实现允许这样做（https://github.com/groue/GRMustache/blob/master/Guides/standard_library.md#each）。

您可以要求您的 mustache 库的开发人员支持该功能。