小胡子部分值被覆盖

Question

如何得到这个输出：

<h1>Colors</h1>
<li><strong>red</strong></li>
<li><a href="#Green">green</a></li>
<li><a href="#Blue">blue</a></li>

来自这个模板：

<h1>{{header}}</h1>
{{#bug}}
{{/bug}}

{{#items}}
  {{#first}}
    <li><strong>{{name}}</strong></li>
  {{/first}}
  {{#link}}
    <li><a href="{{url}}">{{name}}</a></li>
  {{/link}}
{{/items}}

{{#empty}}
  <p>The list is empty.</p>
{{/empty}}

这个数据：

{
  "header": "Colors",
  "first": true,
  "items": [
      {"name": "red", "first": true, "url": "#Red"},
      {"name": "green", "link": true, "url": "#Green"},
      {"name": "blue", "link": true, "url": "#Blue"}
  ],
  "empty": false
}

这样第一个字段就不会被覆盖。

目前我得到这个输出：

<h1>Colors</h1>
<li><strong>red</strong></li>
<li><strong>green</strong></li>
<li><a href="#Green">green</a></li>
<li><strong>blue</strong></li>
<li><a href="#Blue">blue</a></li>

我正在测试 here。

Answer 1

first 键在两个级别定义：项目级别和根级别。

当它没有在项目级别定义时，Mustache 引擎会深入挖掘，并使用在根级别定义的那个。这称为 Mustache 上下文堆栈，您刚刚学到了它。

现在答案很简单，不是吗？为了防止 Mustache 引擎挖掘上下文堆栈并在根级别查找 first，确保 first 在项目级别定义，对于 all 项。将除第一个以外的所有项目设置为 false。

小胡子部分值被覆盖

Mustache section values are overridden

templates

mustache

overriding