Menu
I am having this problem here and I haven't gotten any consistent solution so far looking out there. I am running a Java project with Angular on the front-end, and trying to implement an autocomplete feature using ui-bootstrap, but I always get this error.
Uncaught Error: [$injector:modulerr] Failed to instantiate module textChangrApp due to: Error: [$injector:modulerr] Failed to instantiate module ui.bootstrap due to: Error: [$injector:nomod] Module 'ui.bootstrap' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. http://errors.angularjs.org/1.3.0-rc.4/$injector/nomod?p0=ui.bootstrap
at http://localhost:8080/bower_components/angular/angular.js:80:12
at http://localhost:8080/bower_components/angular/angular.js:1787:17
at ensure (http://localhost:8080/bower_components/angular/angular.js:1711:38)
at module (http://localhost:8080/bower_components/angular/angular.js:1785:14)
at http://localhost:8080/bower_components/angular/angular.js:4024:22
at forEach (http://localhost:8080/bower_components/angular/angular.js:330:20)
at loadModules (http://localhost:8080/bower_components/angular/angular.js:4008:5)
at http://localhost:8080/bower_components/angular/angular.js:4025:40
at forEach (http://localhost:8080/bower_components/angular/angular.js:330:20)
at loadModules (http://localhost:8080/bower_components/angular/angular.js:4008:5) http://errors.angularjs.org/1.3.0-rc.4/$injector/modulerr?p0=ui.bootstrap&p…2F%2Flocalhost%3A8080%2Fbower_components%2Fangular%2Fangular.js%3A4008%3A5)
at http://localhost:8080/bower_components/angular/angular.js:80:12
at http://localhost:8080/bower_components/angular/angular.js:4047:15
at forEach (http://localhost:8080/bower_components/angular/angular.js:330:20)
at loadModules (http://localhost:8080/bower_components/angular/angular.js:4008:5)
at http://localhost:8080/bower_components/angular/angular.js:4025:40
at forEach (http://localhost:8080/bower_components/angular/angular.js:330:20)
at loadModules (http://localhost:8080/bower_components/angular/angular.js:4008:5)
at createInjector (http://localhost:8080/bower_components/angular/angular.js:3948:11)
at doBootstrap (http://localhost:8080/bower_components/angular/angular.js:1480:20)
at bootstrap (http://localhost:8080/bower_components/angular/angular.js:1501:12) http://errors.angularjs.org/1.3.0-rc.4/$injector/modulerr?p0=textChangrApp&…F%2Flocalhost%3A8080%2Fbower_components%2Fangular%2Fangular.js%3A1501%3A12) angular.js:80(anonymous function) angular.js:80(anonymous function) angular.js:4047forEach angular.js:330loadModules angular.js:4008createInjector angular.js:3948doBootstrap angular.js:1480bootstrap angular.js:1501angularInit angular.js:1395(anonymous function) angular.js:24904trigger angular.js:2715eventHandler angular.js:2986
//index.html
<head>
<!-- ... -->
<script src="../bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/angular-aria/angular-aria.js"></script>
<script src="../bower_components/angular-animate/angular-animate.js"></script>
<script src="../bower_components/hammerjs/hammer.js"></script>
<script src="../bower_components/angular-material/angular-material.js"></script>
</head>
//app.js
angular
.module( 'textChangrApp', [ 'ngAnimate', 'ngMaterial','directive.g+signin', 'ui.bootstrap'])
I feel like there must be something wrong in my <head> when importing, since it was working fine so far, and now it crashed. Hope you can give me a little help on this.
Thank you.
306
You must load the ui.boostrap module after the angularjs file.
110
Another way to install this via bower and here are the instructions.
Add the following 2 packages to bower.json in your directory.
"bootstrap": "*",
"angular-bootstrap": "*",
Run bower update from your directory
Add the ui.bootstrap to angular module like below.
Wire it in the view for the bootsrap to work
CSS
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
JS
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
