Angular $injector:unpr with uibModal

Question

The code is almost straight from the ui-bootstrap tutorial. I have a button on my homepage with an ng-click for opening the modal window, but the error I receive in dev tools is :

Error: [$injector:unpr] Unknown provider: $uibModalInstanceProvider <- $uibModalInstance <- modalController

and each click after this adds a modalController to the error message, like

Error: [$injector:unpr] Unknown provider: $uibModalInstanceProvider <- $uibModalInstance <- modalController <- modalController

Error: [$injector:unpr] Unknown provider: $uibModalInstanceProvider <- $uibModalInstance <- modalController <- modalController <- modalController

home.js

'use strict';

angular.module('myApp')
  .controller('homeCtrl', ['$q', '$state', '$timeout', '$scope', '$http', '$filter',
  '$uibModal', function($q, $state, $timeout, $scope, $http, $filter, $uibModal){

$scope.open = function (size){
  var modalInstance = $uibModal.open({
    animation: $scope.animationsEnabled,
    templateUrl: 'app/main/searchModal.html',
    controller: 'modalController',
    size: size,
    resolve: {
      items: function () {
        return $scope.items;
      }
    }
  });

  modalInstance.result.then(function (selectedItem) {
    $scope.selected = selectedItem;
    }, function () {
  });
};
...

modalcontroller.js

'use strict';

angular.module('myApp')
.controller('modalController', ['$scope', '$uibModalInstance', function($scope, $uibModalInstance) {
  $scope.items = items;
  $scope.selected = {
    item: $scope.items[0]
  };

  $scope.ok = function () {
    $uibModalInstance.close($scope.selected.item);
  };

  $scope.cancel = function () {
    $uibModalInstance.dismiss('cancel');
  };
  $uibModalInstance.close();
}]);

Answer 1

Everything looks correct. Another thing to check is to make sure the angular-ui-bootstrap library is getting injected in your application dependencies:

angular.module('myApp', ['ui.bootstrap'])

And that you are using the version of angular-ui-bootstrap that has the prefix changes. Version 0.14.0 introduced the 'uib' prefixes, Version 1.0.0 removed support for un-prefixed components. Prior to version 0.14.0 the $uibModalInstance was $modalInstance.

Answer 2

The problem is on our (the library's) end. When we released 0.14.0 and added all the uib prefixes, we missed adding it to modalInstance . The issue was fixed in 0.14.3.

To fix this issue in 0.14.0 - 0.14.2 simply use $modalInstance instead and note that when you upgrade to 1.0, you'll need to change to $uibModalInstance or the code will barf again.

Here's a link to the relevant issue on GitHub.