Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit 4f38ba9

Browse files
trusktrpetebacondarwin
authored andcommitted
docs(tutorial/step-5): clarify inline annotations
Closes #6998
1 parent f7cf680 commit 4f38ba9

File tree

1 file changed

+18
-16
lines changed

1 file changed

+18
-16
lines changed

docs/content/tutorial/step_05.ngdoc

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -105,28 +105,30 @@ properties are considered private, and should not be accessed or modified.
105105
### A Note on Minification
106106

107107
Since Angular infers the controller's dependencies from the names of arguments to the controller's
108-
constructor function, if you were to [minify](http://goo.gl/SAnnsm) the JavaScript code for `PhoneListCtrl` controller, all of its function arguments would be
109-
minified as well, and the dependency injector would not be able to identify services correctly.
108+
constructor function, if you were to [minify](http://goo.gl/SAnnsm) the JavaScript code for
109+
`PhoneListCtrl` controller, all of its function arguments would be minified as well, and the
110+
dependency injector would not be able to identify services correctly.
110111

111-
There are two ways to overcome issues caused by minification:
112+
We can overcome this problem by annotating the function with the names of the dependencies, provided
113+
as strings, which will not get minified. There are two ways to provide these injection annotations:
112114

113-
* You can create a `$inject` property on the controller function which holds an array of strings.
115+
* Create a `$inject` property on the controller function which holds an array of strings.
114116
Each string in the array is the name of the service to inject for the corresponding parameter.
115-
In the case of our example we would write:
117+
In our example we would write:
116118

117-
```js
118-
function PhoneListCtrl($scope, $http) {...}
119-
PhoneListCtrl.$inject = ['$scope', '$http'];
120-
phonecatApp.controller('PhoneListCtrl', PhoneListCtrl);
121-
```
119+
```js
120+
function PhoneListCtrl($scope, $http) {...}
121+
PhoneListCtrl.$inject = ['$scope', '$http'];
122+
phonecatApp.controller('PhoneListCtrl', PhoneListCtrl);
123+
```
122124

123-
* Use the inline bracket notation which wraps the function to be injected into an array of strings
124-
(representing the dependency names) followed by the function to be injected:
125+
* Use an inline annotation where, instead of just providing the function, you provide an array.
126+
This array contains a list of the service names, followed by the function itself.
125127

126-
```js
127-
function PhoneListCtrl($scope, $http) {...}
128-
phonecatApp.controller('PhoneListCtrl', ['$scope', '$http', PhoneListCtrl]);
129-
```
128+
```js
129+
function PhoneListCtrl($scope, $http) {...}
130+
phonecatApp.controller('PhoneListCtrl', ['$scope', '$http', PhoneListCtrl]);
131+
```
130132

131133
Both of these methods work with any function that can be injected by Angular, so it's up to your
132134
project's style guide to decide which one you use.

0 commit comments

Comments
 (0)