CODEWITHSUNDEEP
angularjscontrollerangularjs-directiveannotationsdependencies
San Jay Falcon
San Jay Falcon

Reputation: 1013

Dependency injection in Angular Directive

Why is injecting a Controller in a directive done through require but other dependencies through the array annotation?

Upvotes: 4

Views: 3897

Answers (2)

Nidhish Krishnan
Nidhish Krishnan

Reputation: 20741

Require a Controller

If you want to share the same instance of a controller, then you use require.

require ensures the presence of another directive and then includes its controller as a parameter to the link function. So if you have two directives on one element, your directive can require the presence of the other directive and gain access to its controller methods. A common use case for this is to require ngModel.

^require, with the addition of the caret, checks elements above directive in addition to the current element to try to find the other directive. This allows you to create complex components where "sub-components" can communicate with the parent component through its controller to great effect. Examples could include tabs, where each pane can communicate with the overall tabs to handle switching; an accordion set could ensure only one is open at a time; etc.

In either event, you have to use the two directives together for this to work. require is a way of communicating between components.

Courtesy of Josh David Miller

How to require a controller in an angularjs directive

For the array annotation reason take a look at this stuffs

Why is the function in angular's DI inline annotation a array element?

Upvotes: 4

Jonathan Rowny
Jonathan Rowny

Reputation: 7588

Controllers are never really injected into something else. When you use require, you're just gaining access to other controllers on the parent element or current element. These "other directives" have to exist on their own on the same element, or parent element, hence the name 'require.'

Another way of putting it is, with require you're not asking for something to be passed in, instantiated, or created, you're just saying "I want that to exist on this element... and oh by the way I can access it in the link function since I know it exists."

Upvotes: 1

Related Questions