Unknown provider: $modalProvider <- $modal error with AngularJS

Question

I keep receiving this error as I\'m trying to implement bootstrap Modal window. What could be the cause of it? I\'ve copy/pasted everything from http://angular-ui.github.io/

Answer 1

Just an extra side note for an issue I also experienced today: I had a similar error "Unknown provider: $aProvider" when I turned on minification/uglify of my source code.

As mentioned in the Angular docs tutorial (paragraph: "A Note on Minification") you have to use the array syntax to make sure references are kept correctly for dependency injection:

var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];

For the Angular UI Bootstrap example you mention you should this replace this:

var ModalInstanceCtrl = function ($scope, $modalInstance, items) { 
   /* ...example code.. */
}

with this array notation:

var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) { 
   /* copy rest of example code here */ 
}];

With that change my minified Angular UI modal window code was functional again.