Angular Js Dependency Injection

Question

Hi I am having a great doubt in AngularJS Dependency Injection. My question is

While loading index page i am giving reference to all js which ever am using in my application. So what does dependency injection in Angular really do?

I mean in general once the JS is loaded we can use it why are we going for this Dependency injection

It will be great if the JS is loading dynamically because of this dependency injection but it is not like that then what is the real use of Dependency Injection

Answer 1

I guess you are confused between the dependency as a js library and what's dependency injection is.

when you add the library to your main HTML file you are practically including the code to be use, but it doesn't mean that you are actually injecting that dependency on your code.

one of the outcomes of using DI is to make your code testable and decouple your implementation from its dependencies and be more TDD

for example, if you inject a dependency in you controller you can replace that dependency later on with a mock object and test the functionality of the controller and not the service itself.

from the angular documentation:

Dependency Injection (DI) is a software design pattern that deals with how components get hold of their dependencies. The Angular injector subsystem is in charge of creating components, resolving their dependencies and providing them to other components as requested.

To summarize, there are 2 different types of dependencies libraries you need to reference them in order to have the "code available" and a dependency in your code wich is going to make more easy to maintain and decouple your dependencies.

Answer 2

I can try to reinvent the wheel or write a real nice story.. But I think the team behind AngularJS did a great job explaining the meaning/usage of DI

Dependency Injection Documentation

Scroll to the bottom of the page, and there is a nice explanation of how and why.