bootstrap实现响应式导航栏，并解决滚动条并闪现的问题

每个导航栏的<li>标签上加属性data-toggle="collapse" data-target="#myCollapsible"实现当行栏的显示隐藏，会出现点击时滚动条并闪现的问题。
解决方式是使用angular.element("#myCollapsible").collapse('hide')方法替换。
1、HTML：

<div ng-app="myApp" ng-controller="gridCtrl"> 
	<!--屏幕缩小之后，导航栏将收缩起来-->
	<nav id="navbar-example" class="navbar navbar-default navbar-fixed-top" role="navigation">
	    <div class="container">
	        <div class="navbar-header">
	            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myCollapsible">
	                <span class="sr-only">Toggle navigation</span>
	                <span class="icon-bar"></span>
	                <span class="icon-bar"></span>
	                <span class="icon-bar"></span>
	            </button>
	        </div>
	        <div  class="collapse navbar-collapse" id="myCollapsible">
	            <ul class="nav navbar-nav navbar-right" >
	                    <li ui-sref-active="active" ng-click="hideNav()"><a ui-sref="home" ><span class="glyphicon glyphicon-home"></span><span class="hidden-sm"> 首页</span></a></li>
	                    <li class="dropdown" ng-hide="loginValue1" >
	                        <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
	                            <span class="glyphicon glyphicon-user"></span>
	                            <span class="hidden-sm">账号</span>
	                            <span class="caret"></span>
	                        </a>
	                        <ul class="dropdown-menu">
	                            <li ng-click="hideNav()"><a ui-sref="login" ><span class="glyphicon glyphicon-log-in"></span><span>&nbsp;&nbsp;登录</span></a></li>
	                            <li ng-click="hideNav()"><a><span class="glyphicon glyphicon-plus-sign"></span><span>&nbsp;&nbsp; 注册</span></a></li>
	                        </ul>
	                    </li>
	            </ul>
	        </div>
	    </div>
	</nav>
</div>

2、js上：

<script>
    var app = angular.module('myApp',[]);
    app.controller('gridCtrl', function($scope,$rootScope) {
        var vm = this;
       $rootScope.hideNav = hideNav;
       function hideNav(){
        angular.element("#myCollapsible").collapse('hide')
       }
    });
</script>