2015-04-06 240 views
2

我一直堅持嘗試在螺栓中實施三層子菜單。我希望菜單隻顯示頂層,除非在菜單中選擇,在這一點上,我只想顯示第二層。如果選擇了第二層菜單選項,我只想顯示該選擇的子菜單。到目前爲止,我已經試過這樣:螺栓中的三層子菜單CMS

{% for item in menu %} 

<li class="{% if item|current %}active{% endif %}"> 
    <a href=" {{ item.link }}" {% if item.title is defined %}title='{{ item.title|escape }}'{% endif %} 
     class='{% if item.class is defined %}{{item.class}}{% endif %}'> 
     {% if item.submenu is defined and item|current %} <i class='fa fa-lg fa-caret-down'></i> {% elseif item.submenu is defined and not item|current %}<i class='fa fa-lg fa-caret-right'></i>{% endif %} 
     {{item.label}} 
    </a> 
</li> 
{% if item.submenu is defined and item|current %} 
    <ul class="nav nav-level2"> 
      {% for item in item.submenu %} 
      <li {% if item|current %}class='active' {% endif %}> 
       <a href="{{ item.link }}" {% if item.title is defined %}title='{{ item.title|escape }}'{% endif %}> 
        {{item.label}} 
       </a> 
      </li> 
      {% if item.submenu is defined%} 
       {% if item|current %} 
        <ul class='nav nav-level3'> 
        {% for item in item.submenu %} 
        <li class='{% if item|current %}active{% endif %}'> 
         <a href="{{ item.link }}" {% if item.title is defined %}title='{{ item.title|escape }}'{% endif %}> 
          {{item.label}} 
         </a> 
        </li> 
        {% endfor %} 
        </ul> 
       {% endif %} 
      {% endif %} 
     {% endfor %} 
    </ul> 
{% endif %} 

{%ENDFOR%}

我在config.yml菜單結構:

_sample menu: 
    - label: First Section 
    path: First_Section_Path 
    - label: Second Section 
    path: second_section_path 
    submenu: 
     -label: Second tier 
     path: second_tier_path 
     submenu: 
     -label: Third tier 
     -path: third_tier_path 
    - label: Third Section 
    path: third_section_path 

有沒有更好的方式來做到這一點?還是我錯過了一些明顯的東西?

非常感謝您的幫助。

回答