AngularJs Modules Good architecture

Every AngularJs developer knows about Angular modules and understands what DI is,but sometimes in practice there are some situations,when we see that we have to make an architecture for AngularJs Modules.

Since AngularJS is now a deprecated framework, you can use JavaScript modern frameworks like Vuejs, React and Angular, instead.

Lets see what problem do we have.

angular.module( 'Movie', ['Actor'])    // In this module we need actors
angular.module( 'Actor', ['Movie'])    // In this module We need movies

//    But we will have a circular DI
//    What to do?

Every developer can suggest his solution, but there are many-many developers that suggest the same solutions.So what's the solution? What to do?

The Solution is: We create a modules not like Model/Entity way.We create our modules as a functional, namely if we have any controllers (for more than 1 module), directives or services, we create a module for that like this:


// If we need a Movie module, then
angular.module('Movie',['MoviesManager','ActorsManager'...]) // here we can use the Manager to get/set etc. movies 

// If we need a Actor module, then 
angular.module('Actor',['ActorsManager','MoviesManager',...]) // here we can use the Manager to get/set etc. actors

angular.module('Theatre', ['Actor', 'Movie',..]) // we use only those modules

As you see we will not have any circular DIs or any other problems. This solution is flexible and very useful.

Do you find this helpful?

Related articles