I've created 2 directives: Parent and Child. Trying to get them to talk to one another. It seems if they both have a scope they don't receive the events. This doesn't seem correct according to the documentation which $emit
states: Dispatches an event name upwards through the scope hierarchy notifying the registered ng.$rootScope.Scope#methods_$on listeners.
So surely that should bubble up through scopes?
http://plnkr.co/edit/WNqN4XZKaLAvBEtSyERA?p=preview
Isolate scope is now available only to the isolate directive that requested it and its template
.here is a plunker: http://plnkr.co/edit/EfKJthkQLitWnF2srykM?p=preview
You can create the child directive as a template of the parent directive, because template directives do get the directive's scope as mentioned above.
.directive('parent', function ($timeout) {
return {
template:'<child name="Jimmy"></child>',
Another solution would be to create a controller on the parent directive and to require it in child directives.
.directive('parent', function ($timeout) {
return {
controller: function(){
this.hungry = function(message){
// something
}
}
child directive:
.directive('child', function ($timeout) {
return {
require: "^parent",
link: function (scope, element, attrs, parentCtrl) {
parentCtrl.hungry("I'm hungry!")
In your example both directives have isolated scopes from the same parent scope, so they do not have parent/child relationship.
To get it work as you expected you may specify scope: true
instead of scope: {...}
. In this case the scope of child directive will be really child scope of parent directive's scope.
see the plucker
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With