I have the situation where i need access to multiple directive controller methods.
I can access a method from a parent directive using the require like so:
You need a comma after the require statement
require:['^parentDirective','otherDirective'], //<--- right there
Here's a plunker to show it working while requiring multiple directives
I think this is close to what you want (hopefully):
http://plnkr.co/edit/WO6SROdVFOYlR22JQJPb?p=preview
Here were some thoughts:
I think the controller: function () {}
is executed on the way down, whereas the link: function () {}
is executed on the way back up (which happens after it walks down the DOM tree), meaning you needed to move your code that depends on other controllers from the directive controller to the directive link function.
Directives that utilize require
can only require directives on parent elements (using ^
) or the current element. You had in your html, originally, your elements all siblings. If that needs to be the case you need to wrap all the siblings in a fourth directive that they all "require
".
When you do require: []
an array is passed into the link function. Hence:
link: function(scope, element, attrs, controllers) {
var parent1 = controllers[0];
var other = controllers[1];
}
Does that answer everything?