CODEWITHSUNDEEP
angularjs
demisx
demisx

Reputation: 7796

Add dependency to Angular module after it's been created

Do you guys know if it's possible to add a module dependency after it's been created? Something like that:

// init module in file A
angular.module("myApp", []);

// retrieve module in file B and add new dependencies:
mod = angular.module("myApp");
// now I want to add an 'ngResource' dependency to mod
// ???

EDIT: I understand this may seem a weird question. I am working on a component based app organization and want too see if a subcomponent can add dependencies to it parent component module without defining its own module. Something like that:

app/
 components/
   |__componentA/ 
        |__app.js // initializes component A module
        |__subcomponentA/ 
              |__app.js // want to add subcomponentA dependencies to componentA module from here

My alternative is simply declare all subcomponentA dependencies directly on the componentA module, but from organization point of view, I'd prefer to keep these dependencies inside the subcomponentA directory, so if I later decide to remove the subcomponentA from the app, I don't need to remember to remove its dependencies from the componentA module. I want everything that concerns subcomponentA to be grouped inside the subcomponentA directory. My build script will ensure that componentA code is processed before the subcomponetA is, though.

Thank you to everyone who takes a stab at this.

Upvotes: 26

Views: 14510

Answers (3)

shah
shah

Reputation: 1169

I use the following method for this and working fine for me.

var app = angular.module("myApp", []);

angular.module("myApp").requires.push('ngResource');

Upvotes: 41

Lalit Sachdeva
Lalit Sachdeva

Reputation: 6629

Strange question but still what you trying to achieve is something wrong in prospect of angularjs/SPA/dependency injection

Your use case is something like you wants to use this dependency in a particular module or in one page. Thats why you wants to inject it at one position not the other.

But, doing this would make two different scopes for your application becuase using same name of module if you reinitiallized that module that would be different that the other one which is already declared

say: file A

angular.module("myApp", []);

This is defined and in file B

mod = angular.module("myApp", ['ngResource']);

so this would cause to have two different app with same name in one application and that two app with same name in different files so its something like to have two different angular module inside on application.

Second option: let have the same module across the application and inject in at one point and in any controller you wants to use this inject that as a argument in that controller.

Hope this help!

Upvotes: -2

user677526
user677526

Reputation:

I don't think this is possible. However, I'd love to be proven wrong.

From my experience (and according to the Angular documentation) module dependencies can only be declared when initializing a module. It's worth noting that until the application is bootstrapped, the dependencies aren't completely set. It's not possible to add dependencies to a running application as far as I know, unless there's a way to rebootstrap the entire app, which might have unwanted side effects anyway.

Edit: Actually....I've never tried this, but this actually might be a lot simpler than I originally thought. We could try the following:

File A:

window.myApp_dependencies = []; // Add dependencies to the global scope.

angular.module('myApp', dependencies);

File B:

var mod = angular.module("myApp");

window.myApp_dependencies.push('ngRoute');

This isn't really ideal as you are forced to create a variable on the global scope. It would be possible to do it with modules, though. Note that in this case, the dependencies would only be mutable until the app actually started - so, you could split dependencies across files, but you wouldn't be able to change them at runtime.

I don't know if this works. I'm going to try it out tomorrow, though.

Upvotes: 0

Related Questions