I don't understand the use of $inject in controllers
I am totally confused about inject in Angular. I do not know where to use it and why. Is it only used with factory as described here?
myController.$inject = ['$scope','notify'];
Here notify
is the name of the factory.
That is one approach to support Dependency Injection after your code is minified (if you choose to minify).
When you declare a controller, the function takes parameters:
function ($scope, notify)
When you minify the code, your function will look like this:
function (a, b)
Since AngularJS uses the function parameter names to infer DI, your code will break because AngularJS doesn't know about a
or b
.
To solve this problem, they provided additional ways to declare controllers (or other services/factories/etc) for that matter:
-
For controllers, use the
$inject
method - here you pass an array of literals that map to the parameters of your controller function. So, if you provide['$scope', 'notify']
then the value of the first parameter to your function will be the a scope object associated with this controller and the second parameter will be the notify service.
-
When declaring new controllers, services, etc, you can use the array literal syntax. Here, you do something like this:
angular.module('myModule').controller('MyController', ['$scope', 'notify', function ($scope, notify) { ... }]);
The array as a parameter to the controller function maps the DI objects to your function parameters.
I prefer Option #2 when declaring controllers etc as it is easier to read/understand/cross-check since it is all in the same place.
To complement @mark answer, it is important to note that using the $inject method in the style of:
MyController.$inject = ['$scope', 'notify'];
allows you to add injection dependencies when building providers which are the only angular recipes that don't allow 'friendly' annotation style i.e.:
.controller('MyController', ['$scope', 'notify',...
dependencies to be declared.
The way you should use $inject
is:
function ApplicationController($scope){
$scope.greet = "Foo is Not Great!5";
}
ApplicationController.$inject = ['$scope','$ionic'];
app.controller('ApplicationController', ApplicationController);
We need to this as to protect the code from uglifying or minimization.
function(firstName,lastName)
may get turned into function(n,m)
.
So for AngularJS it will break the code because $scope
can be replaced by 's'. This is because without the $
sign the angularJS won't be able to recognize the code.
It's mandatory to use this format when we are having ng-strict-di
attribute