AngularJS: add dependencies to my app before bootstrap it

Question

I am working with AngularJS from a short amount of time so I am still a kind of lost with it. Sorry if the question is trivial or was already asked... I have seen so many different questions / posts / docs that I am really confused.

This is the problem I am facing: I would like to dynamically add dependencies to my app (I am going to refer to it as rootApp), before bootstrap it.
At the moment the bootstrap happens manually: for what I have read on the web, should be possible to dynamically add dependencies to the app before bootstrap it (and that is why the bootstrap is happening manually).

I have different templates (powered by Template Toolkit) that can load different modules as dependency: for example, the template "myComponent" needs to load, as dependency, the Angular module myComponent; the template "myTable" needs to load, as dependency, the Angular module NGTable, etc...
What I would like to do is to define the module for the rootApp as:
// NOTE: no dependencies as argument!
rootAppModule = angular.module('rootApp', []);

and then add dependencies on demand, something like:

rootAppModule.pushDependency( myComponentModule ); rootAppModule.pushDependency( NGTableModule );

then finally bootstrap:
angular.bootstrap(document, ['rootAppModule']);

Someone can help me?

PS I have seen there are Angular plugins to load dependencies AFTER the bootstrap of the app but here I would be happy doing it before the bootstrap. It should be easier, so I would prefer to avoid (not needed?) complexity.

edit:
I have found the array "requires", follows an example: angular.module("rootAppModule").requires.push("myComponentModule");
from here
Anybody can tell if that is a reliable solution?

But do you need specific dependencies for different controllers? In that case you could use the 'resolve' property in $routeProvider to load dependencies before loading the controller. Doc: docs.angularjs.org/api/ngRoute/provider/$routeProvider — Mario Levrero
– Mario Levrero, Commented Jun 24, 2014 at 11:03
I don't... I just need to specify dependencies (as "components" or "plugins") for the app itself before its bootstrapping. I don't understand why it shouldn't be the same easy as push an item (a dependency) in a list (the dependency list). (Thanks anyway) — lzzluca
– lzzluca, Commented Jun 24, 2014 at 11:14
maybe combining requirejs and angular would solve your problem. Have a look at github.com/tnajdek/angular-requirejs-seed — marcinn
– marcinn, Commented Jun 24, 2014 at 11:52
Thanks @marcinn . Honestly that is the next step in my roadmap but, at the moment, I was thinking about something quicker, to just fill the dependencies of my app before the bootstrap. — lzzluca
– lzzluca, Commented Jun 24, 2014 at 12:27

Community · Accepted Answer · 2017-05-23 10:26:13Z

1

Well, this was already in the "edit" but a friend told me that is good habit to answer own questions when there is an answer, so here it is:

I have found the array "requires", follows an example: angular.module("rootAppModule").requires.push("myComponentModule");
from here

Anybody can tell if that is a reliable solution?
Thanks.

edited May 23, 2017 at 10:26

CommunityBot

11 silver badge

answered Jun 26, 2014 at 10:59

lzzluca

8266 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS: add dependencies to my app before bootstrap it

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related