SmartMenus和Handlebars问题

时间:2015-11-19 22:12:02

标签: twitter-bootstrap handlebars.js

将SmartMenus(http://www.smartmenus.org/)与Handlebars一起使用时,我得到了奇怪的结果。代码如下。导航栏上的最后一个条目会自动添加插入符号,并在下载时显示下拉列表。放置在Handlebars循环中的项目没有添加插入符号,并且在悬停时不显示下拉列表。任何想法Handlebars正在做什么搞乱事情?

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="/">Test</a>
  </div>

  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      {{#each model.navigation as |item|}}
        <li><a href="{{item.link}}">{{item.title}}</a>
          <ul class="dropdown-menu">
            <li><a href="#">One more separated link</a>
              <ul class="dropdown-menu">
                <li><a href="#">A long sub menu</a>
                  <ul class="dropdown-menu">
                    <li><a href="#">Action</a></li>
                  </ul>
                </li>
                <li><a href="#">Another link</a></li>
                <li><a href="#">One more link</a></li>
              </ul>
            </li>
          </ul>
        </li>
      {{/each}}
      <li><a href="#">Dropdown</a>
        <ul class="dropdown-menu">
          <li><a href="#">One more separated link</a>
            <ul class="dropdown-menu">
              <li><a href="#">A long sub menu</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                </ul>
              </li>
              <li><a href="#">Another link</a></li>
              <li><a href="#">One more link</a></li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
  </div>

</div>

从Handlebars循环中的一个条目生成输出:

<li><a href="test">Test</a>
  <ul class="dropdown-menu">
    <li><a href="#">One more separated link</a>
      <ul class="dropdown-menu">
        <li><a href="#">A long sub menu</a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
          </ul>
        </li>
        <li><a href="#">Another link</a></li>
        <li><a href="#">One more link</a></li>
      </ul>
    </li>
  </ul>
</li>

从最后一个条目生成的输出:

<li><a href="#" class="has-submenu">Dropdown<span class="sub-arrow">...</span></a>
  <ul class="dropdown-menu">
    <li><a href="#" class="has-submenu">One more separated link<span class="sub-arrow">...</span></a>
      <ul class="dropdown-menu">
        <li><a href="#" class="has-submenu">A long sub menu<span class="sub-arrow">...</span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
          </ul>
        </li>
        <li><a href="#">Another link</a></li>
        <li><a href="#">One more link</a></li>
      </ul>
    </li>
  </ul>
</li>

0 个答案:

没有答案