CODEWITHSUNDEEP
angularjs
Léon Pelletier
Léon Pelletier

Reputation: 2741

Is there a clearer name to describe the Array Syntax in AngularJS

I can read in AngularJS doc that when using a syntax where dependencies are specified in strings before being used in function. (e.g. .controller('InvoiceController', ['currencyConverter', function(currencyConverter) { [...]), this is called Array Syntax.

Angular uses this array syntax to define the dependencies so that the DI also works after minifying the code, which will most probably rename the argument name of the controller constructor function to something shorter like a.

I'm searching for a clearer, or at least more specialized term to describe this approach, as I think that it sounds weird and means nothing when discuting with co-workers.

Upvotes: 2

Views: 59

Answers (4)

Guinn
Guinn

Reputation: 1385

Basicly what happens is that using Array Syntax instead of just parameters in the function, you make sure that the dependencies are injected exactly as defined in the array syntax. If you would not use the array syntax, there is a chance that the minification of your code renames the dependencies of your controller to a, b, c and your app would not know what you want to inject with a, b, c. While when you use the Array Syntax, your app knows that a stands for the first entry in your array, b for the second, c for the third etc. In other words, It doesn't matter how the dependencies inside the: function() bit are called, as long as the names in the array match the names of the dependencies you want to inject.

Upvotes: 0

Donal
Donal

Reputation: 32713

This approach is called 'Inline Array Annotation', it is a type of 'Dependency Annotation'.

You are basically annotating the controller so that the injector knows what services to inject into the function.

There are three ways of annotating your code with service name information:

  • Using the inline array annotation (this is the preferred approach).
  • Using the $inject property annotation.
  • Implicitly from the function parameter names (not recommended).

Taken from here.

Inline Array Annotation

What you have in your example. You specify the dependencies in an in-line array.

myModule.controller('MyController', ['$scope', 'someService', function($scope, someService ... ]

$inject Property Annotation

Here you can use $inject to inject your dependencies.

var MyController = function($scope, someService) ...

MyController.$inject = ['$scope', 'someService'];
myApp.controller('MyController', MyController);

Implicit Annotation

Here you don't specify the dependencies in an array. This causes problems if you minify your code.

someModule.controller('MyController', function($scope, someService)

Upvotes: 2

Anna
Anna

Reputation: 101

This parameter of controller is in an array format, hence the array syntax term. I think what you actually need to communicate is that controller takes as parameter a dependency list in an array format.

Upvotes: 0

John Bledsoe
John Bledsoe

Reputation: 17652

The Angular docs specify three terms for injection annotation:

  • Inference
  • $inject Annotation
  • Inline (this is the array syntax to which your question refers)

Perhaps that's the term you're looking for.

https://docs.angularjs.org/api/auto/service/$injector

Upvotes: 2

Related Questions