Problem importing Angular module from different file

ionic-v1
1

Hi guys!

I experience a problem with importin angular module (into app.js) from a different file. A brief example:

js/app.js:

// if uncomment the next line, app works
// angular.module('API', []);

var app = angular.module('ionicApp', ['ionic', 'API']);

lib/API.js:

var app = angular.module('API', []);
app.config({});

index.html

blah blah
  <script src="lib/API.js"></script>
  <script src="js/app.js"></script>
</head>

<body>
  <ion-nav-view name="basicForm"></ion-nav-view>
</body>

So if i try to import an Angular module from the other file, the app just does not render anything. Whilst imported module from the same file works well.

2

maybe you sould take a look in your javascript console in your browser (chrome --> dev tools)

because ionic is also an own angular module and you are loading it via another file :wink:

3

Thanks for your reply! I checked the error console (totally forgot about it) and it confirmed my idea. It actually says:

Error: [$injector:modulerr] Failed to instantiate module ionicApp due to:
[$injector:modulerr] Failed to instantiate module API due to:
[$injector:nomod] Module 'API' 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.

enter link description here
So here is a link provided by console.
So the thing is that angular does not see this file. Thats why the problem is ‘how to make angular see some other files’

4

try to write your API-app not on your variable app

1 Like
5

lol, that worked!

So the thing was that javascript created this variable out of global scope… Thank you for your help :smile:

1 Like