title: Angular UI Bootstrap $uibModal not being injected?
body: <p>I'm trying to use angular-bootstrap and for some reason I'm getting an <strong>unknown provider</strong> error.</p>
  
  <p>Everything looks to be in order. I've bower installed the latest version, as you can see in my bower.json file below.</p>
  
  <p>Here is my bower.json file:</p>
  
  <pre><code> {
    "name": "client",
    "version": "0.0.0",
    "dependencies": {
      "angular": "^1.5.8",
      "bootstrap-sass-official": "^3.2.0",
      "angular-animate": "^1.4.0",
      "angular-cookies": "^1.4.0",
      "angular-resource": "^1.4.0",
      "angular-route": "^1.4.0",
      "angular-sanitize": "^1.4.0",
      "angular-touch": "^1.4.0",
      "angular-ui-router": "^0.3.1",
      "jquery": "^2.2.0",
      "angular-xeditable": "^0.2.0",
      "oclazyload": "^1.0.9",
      "angular-motion": "^0.4.4",
      "angular-local-storage": "^0.5.0",
      "angular-sweetalert": "latest",
      "angular-password": "^1.0.3",
      "ng-file-upload-shim": "^12.2.12",
      "ng-file-upload": "^12.2.12",
      "ng-img-crop": "ngImgCrop#^0.3.2",
      "ngvideo": "^1.0.2",
      "angular-bootstrap": "^2.2.0"
    },
    "devDependencies": {
      "angular-mocks": "^1.4.0"
    },
    "appPath": "app",
    "moduleName": "clientApp",
    "overrides": {
      "bootstrap": {
        "main": [
          "less/bootstrap.less",
          "dist/css/bootstrap.css",
          "dist/js/bootstrap.js"
        ]
      }
    },
    "resolutions": {
      "angular": "~1.x"
    }
  }
  </code></pre>
  
  <p>I've added the reference to my model:</p>
  
  <pre><code>angular
    .module('clientApp', [
      'ngAnimate',
      'ngCookies',
      'ngResource',
      'ui.router',
      'ngSanitize',
      'ngTouch',
      'ui.bootstrap',
      'oitozero.ngSweetAlert'
    ])
  </code></pre>
  
  <p>And I'm injecting it into my controller:</p>
  
  <pre><code>.controller('BalanceWheelController', function($scope, $uibModal, lessons, $state) {
  </code></pre>
  
  <p>And my function to call the modal is: </p>
  
  <pre><code>        var modalInstance = $uibModal.open({
              animation: true,
              backdrop: 'static',
              keyboard: false,
              templateUrl: 'questionsModal.html',
              controller: function($scope, $uibModalInstance, SweetAlert) {
  
                  $scope.close = function() {
                      //self.showingExpenses = false;
                      $uibModalInstance.close();
                      videoId.play();
                  };
              }
          });
  </code></pre>
  
  <p>So I'm really confused as to why I'm getting the following error:</p>
  
  <pre><code>angular.js:10160 Error: [$injector:unpr] Unknown provider: $templateRequestProvider &lt;- $templateRequest &lt;- $uibModal
  http://errors.angularjs.org/1.2.32/$injector/unpr?p0=%24templateRequestProvider%20%3C-%20%24templateRequest%20%3C-%20%24uibModal
      at http://localhost:9000/bower_components/angular/angular.js:78:12
      at http://localhost:9000/bower_components/angular/angular.js:3803:19
      at Object.getService [as get] (http://localhost:9000/bower_components/angular/angular.js:3931:39)
      at http://localhost:9000/bower_components/angular/angular.js:3808:45
      at getService (http://localhost:9000/bower_components/angular/angular.js:3931:39)
      at Object.invoke (http://localhost:9000/bower_components/angular/angular.js:3958:13)
      at http://localhost:9000/bower_components/angular/angular.js:3809:37
      at getService (http://localhost:9000/bower_components/angular/angular.js:3931:39)
      at invoke (http://localhost:9000/bower_components/angular/angular.js:3958:13)
      at Object.instantiate (http://localhost:9000/bower_components/angular/angular.js:3978:23) &lt;div ui-view="" class="ng-scope"&gt;
  </code></pre>
  
  <p>Here are my js references in the index.html:</p>
  
  <pre><code>&lt;script src="bower_components/jquery/dist/jquery.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular/angular.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-animate/angular-animate.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-cookies/angular-cookies.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-resource/angular-resource.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-sanitize/angular-sanitize.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-touch/angular-touch.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-ui-router/release/angular-ui-router.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-xeditable/dist/js/xeditable.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-local-storage/dist/angular-local-storage.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/sweetalert/dist/sweetalert.min.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-sweetalert/SweetAlert.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-password/angular-password.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/ng-file-upload/ng-file-upload.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/ng-file-upload-shim/ng-file-upload-shim.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/ng-img-crop/compile/minified/ng-img-crop.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-mocks/angular-mocks.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/bootstrap/dist/js/bootstrap.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-bootstrap/ui-bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"&gt;&lt;/script&gt;
  </code></pre>