1414
1515## DI in a nutshell
1616
17- There are only three ways how an object or a function can get a hold of its dependencies:
17+ There are only three ways an object or a function can get a hold of its dependencies:
1818
1919 1. The dependency can be created, typically using the `new` operator.
2020
@@ -23,8 +23,8 @@ There are only three ways how an object or a function can get a hold of its depe
2323 3. The dependency can be passed in to where it is needed.
2424
2525
26- The first two options of creating or looking up dependencies are not optimal, because they hard
27- code the dependency, making it difficult, if not impossible, to modify the dependencies.
26+ The first two options of creating or looking up dependencies are not optimal because they hard
27+ code the dependency. This make it difficult, if not impossible, to modify the dependencies.
2828This is especially problematic in tests, where it is often desirable to provide mock dependencies
2929for test isolation.
3030
@@ -33,26 +33,26 @@ dependency from the component. The dependency is simply handed to the component.
3333
3434<pre>
3535 function SomeClass(greeter) {
36- this.greeter = greeter
36+ this.greeter = greeter;
3737 }
3838
3939 SomeClass.prototype.doSomething = function(name) {
4040 this.greeter.greet(name);
4141 }
4242</pre>
4343
44- In the above example the `SomeClass` is not concerned with locating the `greeter` dependency, it
44+ In the above example `SomeClass` is not concerned with locating the `greeter` dependency, it
4545is simply handed the `greeter` at runtime.
4646
47- This is desirable, but it puts the responsibility of getting hold of the dependency onto the
48- code responsible for the construction of `SomeClass`.
47+ This is desirable, but it puts the responsibility of getting hold of the dependency on the
48+ code that constructs `SomeClass`.
4949
5050To manage the responsibility of dependency creation, each Angular application has an {@link
5151api/angular.injector injector}. The injector is a service locator that is responsible for
5252construction and lookup of dependencies.
5353
54+ Here is an example of using the injector service:
5455
55- Here is an example of using the injector service.
5656<pre>
5757 // Provide the wiring information in a module
5858 angular.module('myModule', []).
@@ -101,7 +101,7 @@ dependency lookup responsibility to the injector by declaring the dependencies a
101101</pre>
102102
103103Notice that by having the `ng-controller` instantiate the class, it can satisfy all of the
104- dependencies of the `MyController` without the controller ever knowing about the injector. This is
104+ dependencies of `MyController` without the controller ever knowing about the injector. This is
105105the best outcome. The application code simply ask for the dependencies it needs, without having to
106106deal with the injector. This setup does not break the Law of Demeter.
107107
@@ -159,16 +159,18 @@ Sometimes using the `$inject` annotation style is not convenient such as when an
159159directives.
160160
161161For example:
162+
162163<pre>
163164 someModule.factory('greeter', function($window) {
164- ...;
165+ ...
165166 });
166167</pre>
167168
168- Results in code bloat due to the need of temporary variable:
169+ Results in code bloat due to needing a temporary variable:
170+
169171<pre>
170172 var greeterFactory = function(renamed$window) {
171- ...;
173+ ...
172174 };
173175
174176 greeterFactory.$inject = ['$window'];
@@ -177,9 +179,10 @@ Results in code bloat due to the need of temporary variable:
177179</pre>
178180
179181For this reason the third annotation style is provided as well.
182+
180183<pre>
181184 someModule.factory('greeter', ['$window', function(renamed$window) {
182- ...;
185+ ...
183186 }]);
184187</pre>
185188
0 commit comments