Question

我有一个JSON对象，我正在循环以动态创建x数量的UL然后LIs。我需要创建两个{{#each}}来创建内容。然而，当我向我的把手模板添加一个CSS类时，它没有像第二个{{#each}}那样进入UL - 我该如何阻止它？这是模板：

<div class="{{panel-container__Css-class}} {{panel-menu__Css-class}}" data-component="panel">
  {{#each sections}}
  <ul id="{{id}}" class="{{panel-menu__Css-class}}">
    {{#each list}}
    <li><a href="{{url}}">{{title}}</a></li>
    {{/each}}
  </ul>
  {{/each}}
</div>

这是我传递的内容：

    <nav data-component="navigation">
        {{> nav-dropdown menu-button__Css-class="menu-button" menu-button__Css-class-nav="panel"  target-id="panel-nav"  }}
        {{> nav-dropdown menu-button__Css-class="region-button" menu-button__Css-class-nav="region" target-id="panel-region" menu-button__copy=panel.copy}}
        {{!--var links = [{"title": "Test","url": "/"}];--}}
        {{> panel panel-menu__Css-class="navigation__menu-styles" panel-container__Css-class="navigation__menu-container" sections=navigation.sections links=navigation.sections.list  }}
    </nav>

Answer 1

我认为您所寻找的是Handlebars path，可让您从panel-menu__Css-class中获取{{#each sections}}的价值。您需要了解当您在{{#each sections}}范围内时，this上下文是sections数组的当前迭代元素。您必须将级别升级到具有您尝试访问的panel-menu__Css-class属性的父上下文：

<ul id="{{id}}" class="{{../panel-menu__Css-class}}">

在动态创建的把手模板中添加css类

1 个答案: