title: error when injecting $modal in angular
body: <p>I am trying to open a modal popup based on some condition. However i am getting the below error 
  <code>Error: [$injector:unpr] http://errors.angularjs.org/1.2.3/$injector/unpr?p0=%24modalProvider%20%3C-%20%24modal
      at Error (&lt;anonymous&gt;)</code></p>
  
  <p>Below is my Code: "ui.bootstrap" is included in the app.</p>
  
  <pre><code>angular.module('myApp').controller('myController', function ($scope, $timeout, $location, $window, $log, $rootScope, $modal) {
  
  $scope.selectRow = function (position) {
  
      $scope.changed = false;
      if ($scope.select !== undefined &amp;&amp; $scope.selectedRow !== position){
             $scope.changed = true;
             $scope.open();
      }
      $scope.select = position;
  };
  
  
  $scope.open = function () {
      console.log('Opening modal');
      var modalInstance = {
          templateUrl: 'modal.html',
          dialogClass: 'modal-selection',
          controller: ModalInstanceCtrl
      };
      $modal.open(modalInstance);
  };
  
  
  var ModalInstanceCtrl = function ($modalInstance) {
  
      $scope.ok = function () {
          $modalInstance.close();
      };
  
      $scope.cancel = function () {
          $modalInstance.dismiss('cancel');
      };
  };
  });
  </code></pre>
  
  <p>My HTML:</p>
  
  <pre><code>&lt;div id="modal-select" &gt;
      &lt;h3&gt;
          Choose appropriate change
      &lt;/h3&gt;
      &lt;div&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href="#"&gt;Change 1&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;Change 2&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;Change 3&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;Change 4&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;button class="button" ng-click="cancel()"&gt;
              Cancel
          &lt;/button&gt;
          &lt;button class="button" ng-click="ok()"&gt;
              Done
          &lt;/button&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>