I'm trying to make a multiple or a nested dropdown like this:
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li ng-show="isLoggedIn()"><a href="/#/account">{{ currentUser() }}</a></li>
<li ng-hide="isLoggedIn()"><a href="/#/login">Log In</a></li>
<li ng-show="isLoggedIn()"><a href="/#/postad">Post Ad</a></li>
<li dropdown ng-show="isLoggedIn()">
<a href="#" dropdown-toggle><span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-cog"></span></a>
<ul class="dropdown-menu forAnimate" role="menu">
<!--Sub-dropdown-->
<li dropdown>
<a href="#" dropdown-toggle>Account<span class="caret"></a>
<ul class="dropdown-menu forAnimate" role="menu">
<li><a href="#">Edit</a></li>
<li><a href="" ng-click="logOut()">Delete Account</a></li>
</ul>
</li>
<!--End Sub-dropdown-->
<li><a href="#">Change password</a></li>
<li class="divider"></li>
<li><a href="" ng-click="logOut()">Log Out</a></li>
</ul>
</li>
</ul>
</div>However I cannot click "Account" as in this picture: enter image description here "Edit" and "Delete Account" is remain hidden. How to solve this?
