The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

Directive Communication

Directive Communication

4:28
In AngularJS, hierarchical directives have the ability to communicate with one another via their defined controllers. With simple syntax/notation you are able to define links between directives and their controllers.
Watch this lesson now
Avatar
egghead.io

In AngularJS, hierarchical directives have the ability to communicate with one another via their defined controllers. With simple syntax/notation you are able to define links between directives and their controllers.

Avatar
Alana

Thank for this great tutorial on directive communication. I was wondering how the state directive would access it's own controller. Would it have to require it's own controller?

In reply to egghead.io
Avatar
Albert

When you define your directive, you always get access its own controller by returned object, just like link, you don't have to require its own controller at all.

In reply to Alana
Avatar
Pablo

How would you go about communicating down the hierarchy? I have had some limited success using $rootScope.$broadcast(), but I assume using $rootScope there should be avoided in favour of a specific $scope. However I cannot make that to work.

In reply to egghead.io
Avatar
James

At around 1 min 25 sec specific syntax is used to require another directives controller. The "^" symbol is pre-pended to the directive name where the controller lives. This video seems to place emphasis on hierarchy on directives. If it is the case that "^" is used to denote some ancestor it would be nice if that was made explicit. Furthermore is there a different character for accessing the controller of a descendant directive at arbitrary depth ?

Avatar
Joel

At around 1 min 25 sec specific syntax is used to require another directives controller. The "^" symbol is pre-pended to the directive name where the controller lives. This video seems to place emphasis on hierarchy on directives. If it is the case that "^" is used to denote some ancestor it would be nice if that was made explicit. Furthermore is there a different character for accessing the controller of a descendant directive at arbitrary depth ?

The require: '^ctrlName' syntax in the directive definition object is used to signal a parent controller is required. The parent controller is then made available as in the link function as the fourth argument. This is useful for creating complex components that need to communicate state between siblings.

There are other accessors that you can learn about. They were out of scope for this basic lesson.

In reply to James
HEY, QUICK QUESTION!
Joel's Head
Why are we asking?