title: When I use ngRouter, navbar is not collapsing
body: <p>When I use ngRouter, navbar is not collapsing after selecting a link in small devices</p>
  
  <p>angilarjs:</p>
  
  <pre><code>var app = angular.module('MyTemplate',['ngRoute','ui.bootstrap']); 
  app.controller("templateCtrl",function($scope){ 
    $scope.navbarCollapsed = true;
  });
  
  app.config(['$routeProvider', function($routeProvider) {
    $routeProvider
      .when('/Page1', {
        templateUrl: 'Page1.html',
        controller: 'Page1Ctrl'
      })
      .when('/Page2', {
        templateUrl: 'Page2.html',
        controller: 'Page2Ctrl'
      })
      .otherwise({
        redirectTo: '/Page1'      
      });
  }]);
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="navbar-header"&gt;
    &lt;button type="button" class="navbar-toggle" ng-click="navbarCollapsed = !navbarCollapsed"&gt; 
      &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt; 
      &lt;span class="icon-bar"&gt;&lt;/span&gt; 
      &lt;span class="icon-bar"&gt;&lt;/span&gt; 
      &lt;span class="icon-bar"&gt;&lt;/span&gt; 
    &lt;/button&gt;
    &lt;a class="navbar-brand" href=""&gt;Navigation bar&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;!-- nav links for toggling --&gt;
  &lt;div class="collapse navbar-collapse" collapse="navbarCollapsed"&gt;
    &lt;ul class="nav navbar-nav nav_width"&gt;
      &lt;li&gt;&lt;a href="#dashboardPage"&gt;Page1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#positionsPage"&gt;Page2&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Please help to fix this issue. Thank you...</p>