In the structure of my directives, there is a need for one directive to have functions in its controller so that child elements can interact with it. However, this directive also needs access to its parent directive's controller. I am unsure of how to achieve this within the controller itself (I know how to do it in the "link()" function, but this time I require the use of the controller for child interactions). It should be achievable using scope:
controller: function($scope){},
link: function (scope, ..., parentCtrl){
scope.parentCtrl = parentCtrl;
}
However, I find this method confusing, as the link function is executed after the controller. Is this an acceptable approach? I am uncertain and worried that it may not be a good design choice.
Visual representation:
ParentParentDirective
controller: function(service){
this.service = service;
}
ParentDirective
controller: function(){
this.callOnService = function(id){
???ParentParentDirective???.service.callSth(id);
}
}
ChildDirective
link(scope, ...,ParentDirectiveCtrl){
scope.makeChanges = ParentDirectiveCtrl.callOnService;
}