某些事件后加载angularjs模块

Question

I am running into some special situation with angularjs and cordova . Basically I want to load angular modules only after deviceready in cordova is fired. My skeleton is somewhat like below in app.js :

angular.module('app', [
'module1',
'module2',
'module3'
])
.run(function() {
});

I could check for any ready event in run() but it happens only after all the modules are executed. I don't want to "micro" check for ready event in each controller.

Two questions:

1. Is there a way to load angular modules only after some event ready ( deviceready specifically)?

2. Bonus : Is there a way to load module1 first, detect for some event ready, then load module2 and module3 ?

Answer 1

Yes for both questions; it is possible to load modules on demand in AngularJs.

Here is a link that contains an in-depth explanation on how to load modules as well as an example project containing example source code: http://blog.getelementsbyidea.com/load-a-module-on-demand-with-angularjs/

The source code of AngularJs actually contains a list of all the modules. However, this list is private, so cannot be modified. To get around this, the author carefully imitated the loading of modules in the AngularJs code in order to load modules at a later point.

I would recommend reading the article carefully so you understand everything and then adapting his code to your own purpose.