CODEWITHSUNDEEP
javascriptangularjs
Stefan Falk
Stefan Falk

Reputation: 25387

Uncaught Error: [$injector:modulerr] trying to inject $module

I am trying to use the modal service from angular bootstrap:

    <script src="bower_components/angular/angular.min.js"></script>
    <script src="bower_components/angular-bootstrap/ui-bootstrap.min.js"></script>      
    <script src="js/index.js"></script>

My app controller (index.js):

var app = angular.module('emaApp', ['ui.bootstrap']);

app.controller('mainCtrl', ['$scope', '$http', '$modal', function($scope, $http, $modal) {
    // ...
}]);

However, I am not getting beyond this error message and I don't see what the problem is:

jquery.min.js:2 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.6.1/$injector/modulerr?p0=emaApp&p1=Error%3A%…host%3A8080%2Fweb%2Fbower_components%2Fangular%2Fangular.min.js%3A21%3A332)
    at angular.js:38
    at angular.js:4759
    at q (angular.js:357)
    at g (angular.js:4720)
    at eb (angular.js:4642)
    at c (angular.js:1838)
    at Mc (angular.js:1859)
    at pe (angular.js:1744)
    at HTMLDocument.<anonymous> (angular.js:32977)
    at j (jquery.min.js:2)

Upvotes: 1

Views: 2248

Answers (3)

Marcus H&#246;glund
Marcus H&#246;glund

Reputation: 16801

To use the modal inject the $uibModal

Your controller would then be:

app.controller('mainCtrl', ['$scope', '$http', '$uibModal', function($scope, $http, $uibModal) {
    // ...
}

Upvotes: 1

krishna
krishna

Reputation: 7

You didn't close the controller correctly

Instead of this

app.controller('mainCtrl', ['$scope', '$http', '$modal', function($scope, $http, $modal) { // ... }

use this

app.controller('mainCtrl', ['$scope', '$http', '$modal', function($scope, $http, $modal) { // ... }]);

Upvotes: 0

korteee
korteee

Reputation: 2682

You've got to load this script:

<script src="..path_to_script../ui-bootstrap-tpls.js"></script>

Upvotes: 1

Related Questions