kątowa UI wielopoziomowe rozwijane Przegubowe

Question

Próbuję użyć kątowego UI Dropdown Toggle stworzyć wielopoziomowy/zagnieżdżony spadek w dół.

Kiedy klikam na pierwszym poziomie menu rozwijanego po prostu zamyka się całkowicie i nie ujawnia drugą kondygnację.

Mam załączeniu bardzo podstawowe plunkr wykazania się szkielety wersję co próbuję osiągnąć.

http://plnkr.co/edit/c0GbKQoYWICXwd3JRWGV?p=info

Każda pomoc, bardzo mile widziane.

Dzięki

Answer 1

Można użyć klasy „rozwijanej-podmenu” do osiągnięcia tego celu.

<div class="btn-group dropdown"> 
    <button class="dropdown-toggle">Toggle</button> 
    <ul class="dropdown-menu"> 
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li class="dropdown-submenu"> 
     Sub List 
     <ul class="dropdown-menu"> 
     <li>Submenu Item 1</li> 
     <li>Submenu Item 2</li> 
     </ul> 
    </li> 
    </ul> 
</div> 

Answer 2

Podmenu zostało usunięte z Boostrap 3, ponieważ jest nieistotne dla urządzeń mobilnych.

„podmenu po prostu nie ma zbyt wiele miejsca w sieci już teraz, zwłaszcza mobile web Zostaną one usunięte z 3.0.” - https://github.com/twbs/bootstrap/pull/6342

przykład, który używa Bootstrap 3.0. 0 (końcowe) http://bootply.com/86684

Kod z StackOverflow post: Bootstrap 3 dropdown sub menu missing

Answer 3

Możesz użyć modułu podmenu ng-bootstrap, aby uzyskać podmenu, którego szukasz.

https://www.npmjs.com/package/ng-bootstrap-submenu

Oto plnkr demonstrując to wykorzystanie.

<nav class="navbar navbar-default"> 
    <div class="navbar-header"> 
     <button class="navbar-toggle" type="button" 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">ng-bootstrap-submenu</a> 
    </div> 

    <div class="collapse navbar-collapse"> 
     <ul class="nav navbar-nav"> 
     <bootstrap-submenu ng-repeat="item in menuItems" menu-item="item"> 
     </bootstrap-submenu> 
     </ul> 
    </div> 
</nav>