angular module: order of loading

Question

I fount out in the official angularjs documents that

angular.module('foo', []) makes the definition of foo module, and

angular.module('foo') is calling (not making) foo module.

But I could not start my app when I wrote the code below,

app/controllers/file1.js var app = angular.module('app.controller', []); app/controllers/file2.js var app = angular.module('app.controller');

and, it worked when I only changed those two declarations:

app/controllers/file1.js var app = angular.module('app.controller'); app/controllers/file2.js var app = angular.module('app.controller', []);

so... I am wondering that

• how the order of loading module is decided
• how should I do when I want to use same module on two or more files

Thanks.

Answer 1

It's pretty straightforward: you must create the module before to be able to use it.

It's clearly a bad idea to create it in a controller file; use a separate file for this purpose, in which you will also be able to make the global configuration (myModule.config()) of your project, for instance. In your case:

/** In "app/controller.js" **/
angular.module('app.controller', []); // Creation of the module

/** In "app/controllers/file1.js" **/
/** In "app/controllers/file2.js" **/
angular.module('app.controller'); // Use of the (already existing) module

The file app/controller.js should be called first. Then, the order of the other files doesn't matter.