您可以使用“折叠”指令进行此操作:http ://jsfiddle.net/iscrow/Es4L3/ (选中HTML中的两个“注释”)。
<!-- Note: set the initial collapsed state and change it when clicking -->
<a ng-init="navCollapsed = true" ng-click="navCollapsed = !navCollapsed" class="btn btn-navbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Title</a>
<!-- Note: use "collapse" here. The original "data-" settings are not needed anymore. -->
<div collapse="navCollapsed" class="nav-collapse collapse navbar-responsive-collapse">
<ul class="nav">
也就是说,您需要将折叠状态存储在变量中,并且还可以通过(简单地)更改该变量的值来更改折叠状态。
https://github.com/angular-ui/bootstrap/wiki/Migration-guide-for- prefixes
更改collapse
为uib-collapse
。