title: Unable to open bootstrap modal window as a route
body: <p>I'm using bootstrap to display a modal and want it to be shown on click of a anchor tag as a route.
  But i'm getting a module error &amp; can't seem to figure out how to resolve it.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div ng-view&gt;
      &lt;div ng-controller="DetailPageCtrl"&gt;
        &lt;a href="#/profile"&gt;Click here to open modal!&lt;/a&gt;
      &lt;/div&gt;
      &lt;script type="text/ng-template" id="modalContainer"&gt;
          &lt;div ng-controller="ProfileModalCtrl"&gt;&lt;/div&gt;
      &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>var app = angular.module('plunker', ['ui.bootstrap']);
  app.config(function($routeProvider) {
     $routeProvider
        .when('/profile', {
            templateUrl : 'modalContainer',
            controller : 'ProfileModalCtrl'
        });
  })
  app.controller('DetailPageCtrl', function($scope) {
     console.log("detail page");
  });
  app.controller('ProfileModalCtrl', function($scope, $modal) {
      $modal.open({templateUrl : 'modal.html'});
  });
  </code></pre>
  
  <p>Code in plnkr :
  <a href="http://plnkr.co/edit/VbvuWzLqkICFzBYI9sL5?p=preview" rel="noreferrer">http://plnkr.co/edit/VbvuWzLqkICFzBYI9sL5?p=preview</a></p>