Order of AngularJS dependency injection

Question

I am working through an eBook to learn the whole MEAN stack and came across an odd problem when working with angular.

Specifically, I was adding angular-route to my application to render a template. At first I could not get it to work and went over the code several times looking for any error I might have made. In the end, I had typed the order of two dependencies for the main application module differently than the book had shown.

This didn't work

var mainApplicationModule = angular.module(mainApplicationModuleName, ['example', 'ngRoute']);

This worked

var mainApplicationModule = angular.module(mainApplicationModuleName, ['ngRoute', 'example']);

So I don't have a problem exactly, but I was wondering if anyone could explain why this works this way? I have not been able to find anything about the order of dependency declaration mattering. I can post more of my code if it would be helpful.

Answer 1

This comes from Brad Dayley's book on the Subject. The order matters in that the the list of modules(dependencies) to be injected has to be in the the order of "required". So if the example module requires the ngRoute then ngRoute has to be before example.

The angular.module() method uses following syntax:

angular.module(name, [requires],[configFn])

The name parameter is the name under which the module is registered in the injector service. The requires parameter is an array of names of modules that are added to the injector service for this module to use.

This explanation does beg for answer about possibility of circular module references in more complicated case. Here is some light on that by David M. Karr SO Answer Link.