How angularjs support module load dependency

Question

I have a main module that loads the ngRoute service.

 angular.module("app", ["ngRoute", "app.settings"] 

and my app.settings module does not load the ngRoute service,

 angular.module("app.settings", []) .config(["$routeProvider", function($routeProvider){ $routeProvider.when("/settings", { template: "{{message}}", controller:"SettingsController" }); }]) 

But I can use $routeProvider in this module.

Is the loading order of the angular module loaded? Can I load any dependency of any module?

Answer 1

The fact is that your app module loads ngRoute and also loads the app.settings modules, so the dependency is already entered into your Angular application, so there is no need to enter again.

Is the loading order of the Angular module loaded? Order doesn't matter Angular resolves dependencies first, and then compiles modules, controllers, etc.

 angular.module("app", ["ngRoute", "app.settings"] 

Same as

 angular.module("app", ["app.settings", "ngRoute"] 

However, you may encounter problems in some Unit Test scripts, if you download only the app.settings module, your test will fail. But in most cases, you download the app module and all the core modules of your Angular application.

Can I load any dependency of any module? The short answer is yes.

Long answer: your ngRoute dependency must be loaded into the main module, because this is what your app module will need to determine the basic routing, if the dependency is loaded into several modules, it will not throw any error, in fact you should add all dependencies are required for each module, because in large applications there is no guarantee that ngRoute / myFactory / etc is already loaded.

Readability Update