如何在 YAML 前端使用把手 #each 助手答案

【问题标题】：How to use a handlebars #each helper with YAML front matter如何在 YAML 前端使用把手 #each 助手
【发布时间】：2013-09-01 19:47:10
【问题描述】：

我正在使用 assemble.io 来自动化我的前端开发，并希望使用 YAML 前端来创建一个简单的导航菜单。

我想要实现的 HTML 是这样的：

<li><a href="#link1">Link1</a></li>
<li><a href="#link2">Link2</a></li>

我认为正确的车把标记是这样的：

      {{#each sublinks}}
      <li><a href="#{{section}}">{{section}}</li>
      {{/each}}

但是什么是正确的 YFM？我从这个开始，但知道语法不正确：

---
sublinks:
  - section: link1, link2
---

【问题讨论】：

【解决方案1】：

对于这样的模板：

{{#each sublinks}}
<li><a href="#{{section}}">{{section}}</li>
{{/each}}

您需要这样的数据结构：

sublinks = [
    { section: 'link1' },
    { section: 'link2' },
    //...
]

在 YAML 中，它看起来像：

sublinks:
  - section: link1
  - section: link2

你应该也可以使用这个 YAML：

sublinks:
  - link1
  - link2

使用此模板：

{{#each sublinks}}
<li><a href="#{{.}}">{{.}}</li>
{{/each}}

您的 YAML 对应的数据结构如下：

sublinks = [
    { section: 'link1, link2' }
]

除非您想使用 Handlebars 帮助器拆分 'link1, link2' 字符串，否则这并不是非常有用。

【讨论】：

【解决方案2】：

除了@mu 的好答案，你也可以这样做：

鉴于此 YAML 前端问题：

---
sublinks:
  - href: link/to/foo
    text: Foo Text
  - href: link/to/bar
    text: Bar Text
  - href: link/to/baz
    text: Baz Text
---

您的模板如下所示：

{{#each sublinks}}
  <li><a href="#{{href}}">{{text}}</a></li>
{{/each}}

请注意，YAML 规范还允许使用更像 JavaScript 对象的语法：

---
sublinks:
  - {href: link/to/foo, text: Foo Text}
  - {href: link/to/bar, text: Bar Text}
  - {href: link/to/baz, text: Baz Text}
---

【讨论】：

嗨，乔恩，是否必须在破折号 (- {href: link/to/foo, text: Foo Text}) 之后的单行上写入类似 json 的内容，或者我们可以将其拆分为更多行？我习惯将每个键/值都写在自己的行上，以提高可读性；）
YAML 1.2 是 JSON 的超集。您可以期望有效的 JSON 被识别为有效的 YAML。所以，是的，你可以通过让 YAML 看起来更像 JSON 来降低 YAML 的可读性；），但前提是你必须遵循 YAML 的空格格式规则。
谢谢@jonschlinkert，毕竟我想我会继续使用 YAML 语法；）