angular-bootstrap 0.12.0 navbar下拉列表不起作用

Question

我正在使用AngularJS 1.3.10以及Bootstrap 3.3.2和angular-ui-bootstrap 0.12.0.我也使用Angular ui-router进行路由.似乎导航栏下拉列表在0.12.0中不起作用.回落到0.11.0有效.这是我正在使用的代码(部分):

	<div class="navbar navbar-inverse navbar-fixed-top" role="navigation" ng-controller="searchController">
	    <div class="container-fluid">
	        <div class="navbar-header">
		    <button type="button" class="navbar-toggle" ng-init="navCollapsed = true" ng-click="navCollapsed = !navCollapsed">
			<span class="sr-only">Toggle navigation</span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
		    </button>
	            <a ui-sref="dashboard" class="navbar-brand">My Application</a>
	        </div>
	        <ul class="nav navbar-nav navbar-right collapse navbar-collapse" collapse="navCollapsed" >
	            <li ><a ui-sref="dashboard" ng-click="navCollapsed = true"><i class="fa fa-bullseye"></i> Dashboard</a></li>
	            <li ><a ui-sref="topmenu1" ng-click="navCollapsed = true"><i class="fa fa-list"></i> Top Menu 1</a></li>
                    <li class="dropdown">
	                <a class="dropdown-toggle" data-toggle="dropdown">Dropdown
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu">
        	            <li><a ui-sref="item1">Item 1</a></li>
    		            <li><a ui-sref="item2">Item 2</a></li>
    		            <li><a ui-sref="item3">Item 3</a></li>
                        </ul>
                    </li>
	        </ul>
	    </div>
	</div>	

Answer 1

他们增加了一个uib-dropdown和uib-dropdown-toggle指令,你必须现在使用.这是您更新的代码段:

<div class="navbar navbar-inverse navbar-fixed-top" role="navigation" ng-controller="searchController">
    <div class="container-fluid">
            <div class="navbar-header">
            <button type="button" class="navbar-toggle" ng-init="navCollapsed = true" ng-click="navCollapsed = !navCollapsed">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a ui-sref="dashboard" class="navbar-brand">My Application</a>
            </div>
            <ul class="nav navbar-nav navbar-right collapse navbar-collapse" collapse="navCollapsed" >
            <li ><a ui-sref="dashboard" ng-click="navCollapsed = true"><i class="fa fa-bullseye"></i> Dashboard</a></li>
            <li ><a ui-sref="topmenu1" ng-click="navCollapsed = true"><i class="fa fa-list"></i> Top Menu 1</a></li>
            <!-- Notice the dropdown directive -->
            <li class="dropdown" uib-dropdown>
                <!-- Notice the dropdown-toggle directive -->
                <a class="dropdown-toggle" data-toggle="dropdown" uib-dropdown-toggle>Dropdown
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                        <li><a ui-sref="item1">Item 1</a></li>
                        <li><a ui-sref="item2">Item 2</a></li>
                        <li><a ui-sref="item3">Item 3</a></li>
                </ul>
            </li>
            </ul>
    </div>
</div>

您可以在http://angular-ui.github.io/bootstrap/#/dropdown上看到一些示例