0

I am attempting to use bootstrap ui's pagination on and angularjs project. I am receiving error message 'Error: [$injector:modulerr]'. I have been following the example here Angular UI bootstrap pagination not working inside ui.bootstrap.tabs however i'm using json to retrieve data so my code is slightly different.

I've created a Plunker: https://plnkr.co/edit/omQ2qxgkmK5HAkd0wBC6 to display my code.

These are the CDNs I am using for the project: 

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.9/angular-route.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.1.1/ui-bootstrap-tpls.min.js">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" crossorigin="anonymous"></script>
Community
  • 1
  • 1
user3574939
  • 819
  • 3
  • 17
  • 34
  • 1
    Have you injected ui.bootstrap into your angular app module? i.e. var app = angular.module('app', ['ui.bootstrap']) – Dan Keiger Jan 28 '16 at 15:00
  • yes, I injected ui.bootstrap var defaultPage = angular.module('DefaultPage', ['ui.bootstrap']); – user3574939 Jan 28 '16 at 16:03
  • The apps.js file, containing the definition of the main GithubIssues module, is not included in the html page. Read the error message. It says: *Uncaught Error: [$injector:modulerr] Failed to instantiate module GithubIssues due to: Error: [$injector:nomod] Module 'GithubIssues' is not available!*. – JB Nizet Jan 28 '16 at 22:20
  • @JBNizet when I inject 'ui-bootstrap' in apps.angular.module('GithubIssues', ['ui-bootstrap']) the problem still exists. – user3574939 Jan 28 '16 at 22:48
  • Read my comment again. Read the error message again. I never told you to do that. I told you to ass the apps.js script in the html page. – JB Nizet Jan 28 '16 at 22:51
  • the error message is foreign to me. I don't understand what it's asking me to do. – user3574939 Jan 28 '16 at 23:01
  • Read my comment again. The message complains that the module GithubIssues is not defined. Is it defined somewhere in the code? Yes, in apps.js. But, is the apps.js file loaded by the HTML page? NO, IT IS NOT. Because there is no `` in the HTML page. – JB Nizet Jan 28 '16 at 23:20
  • Thanks for explain @JBNizet Nizet. Yes, A reference to and ng-app="GithubIssues" are define in index.html . – user3574939 Jan 28 '16 at 23:26
  • Because you just added them 2 minutes ago. Now read the new error message. It now compains about ui.bootstrap not being available. Is there a script in the html file that loads angular-ui-bootstrap? No, there is not. Same message, same mistake. – JB Nizet Jan 28 '16 at 23:37
  • @JBNizet No, I added apps.js to the Plunker 2mins ago, however the application on my desktop had the script in index.html. :) This is the error I am receiving in Chrome developer Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.9/$injector/modulerr?p0=GithubIssues&p1=Err…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.9%2Fangular.min.js%3A19%3A463) – user3574939 Jan 28 '16 at 23:46
  • All we have is your plunkr. You didn't post any code, and any error message. How are we supposed to guess what the problem is without this critical information. Stop using the minified version of angular: you'll have clear error messages. And post the code and the error in the question. Delete thelink to the plunkr if it sn't the same code as the one you're actually using. – JB Nizet Jan 28 '16 at 23:49
  • @JBNizet I've updated my Plunker with my most recent code. – user3574939 Jan 29 '16 at 00:02
  • And you still don't read my comments, and the error messages in the console: you're trying to load filters.js, which doesn't exist. Your app.js depends on angular-ui-bootstrap, but there is no script loading angular-ui-bootstrap in the HTML page. It's the third time you make the same mistake. – JB Nizet Jan 29 '16 at 00:07
  • @JBNizet Thank you for your help. – user3574939 Jan 29 '16 at 00:24

0 Answers0