title: Angular: $uibModal undefined
body: <p>i have this error when i used ui.bootstrap.modal:</p>
  
  <pre><code>Error: $uibModal is undefined
  </code></pre>
  
  <p>Module:</p>
  
  <pre><code>    (function(angular) {
      /**
       * finanziarioTerziController
       *
       * a controller defined in the finanziarioTerziModule and using a sample service.
       */
      angular.module('finanziarioTerziModule')
          .controller('finanziarioTerziController', ['$scope', 'finanziarioTerziService', function ($scope, finanziarioTerziService) {
              'use strict';
  
              $scope.elencoPatrimonioTerziCollapsed = true;
              $scope.elencoPatrimonioTerzi = new Array();
  
              $scope.products = [];
  
              $scope.productToAdd = [];
  
              $scope.saveProduct = function (productToAdd) {
                  for (var i = 0; i &lt; productToAdd.length; i++) {
                      $scope.products.push(productToAdd[i]);
                      console.log($scope.products[i]);
                  }
                  $scope.reset();
              };
  
  
              $scope.reset = function () {
                  $scope.productToAdd.length = 0;
              };
  
              $scope.remove = function (index) {
                  $scope.productToAdd.splice(index, 1);
              };
  
              $scope.addProduct = function () {
                  $scope.productToAdd.push({
                      tipologia: '',
                      descrizione: '',
                      contratto: '',
                      ctv: '',
                      possesso: ''
                  });
              };
  
              $scope.open = function ($uibModal) {
                  var modalInstance = $uibModal.open({
                      animation: $scope.animationsEnabled,
                      templateUrl:  'finanziarioTerziSearch.html' ,
                      controller: 'finanziarioTerziModule',
                      resolve: {
                          items: function () {
                              return $scope.items;
                          }
                      }
                  });
              };
              open.$inject = '$uibModal';
  
              finanziarioTerziService.getPatrimonioTerzi().then(function (response) {
  
                  if (response.status != '200') {
                      console.log('status diverso da 200');
                      return;
                  }
  
                  var elenco = response.data;
  
                  for (var i = 0; i &lt; elenco.length; i++) {
                      $scope.elencoPatrimonioTerzi.push(elenco[i]);
                  }
              });
          }]);
  })(angular);
  </code></pre>
  
  <p>template(the .html file)</p>
  
  <pre><code>&lt;div class="modal-header"&gt;
  &lt;h3 class="modal-title"&gt;This is template 1&lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="modal-body"&gt;
  &lt;ul&gt;
      &lt;li ng-repeat="item in items"&gt;
          &lt;a href="#" ng-click="$event.preventDefault(); selected.item = item"&gt;{{ item }}&lt;/a&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  Selected: &lt;b&gt;{{ selected.item }}&lt;/b&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Button (inside another controller)</p>
  
  <pre><code> &lt;button class="btn btn-default" ng-click="open()" &gt;Cerca Prodotto&lt;/button&gt; 
  </code></pre>
  
  <p>I'm try to injected $uibModel in the controller, but not work
  Sorry for my language, i'm italian</p>
  
  <p>EDIT: in 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/angular-bootstrap/ui-bootstrap-tpls.js"&gt;&lt;/script&gt;
      &lt;script src="../bower_components/angular-route/angular-route.js"&gt;&lt;/script&gt;
      &lt;script src="../bower_components/angular-ui-router/release/angular-ui-router.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>EDIT2: adjust ng-controller
  EDIT 3: in app.js</p>
  
  <pre><code>angular.module('patrimonioApp',['ngRoute', 'ui.bootstrap', 'ui.router',
      'commonModule', 'homeModule', 'finanziarioModule', 'polizzeModule', 'finanziarioTerziModule' ])
  .config(['$routeProvider', function($routeProvider) {
  </code></pre>
  
  <p>EDIT 4: I solved but now I have a new Error</p>