I'm building a component structure of the kind
<c:parent>
<c:child name="xyz" />
</c:parent>
and I need the parent to know about its children. Why, because the parent is displaying something for all the children. So I need it BEFORE that parent initializes itsself.
I thought I can do that by firing events on child initialization
<aura:component >
<aura:attribute name="name" type="Integer" required="true" />
<aura:registerEvent name="initialized" type="c:registerEvent" />
<aura:handler name="init" value="{!this}" action="{!c.init}" />
</aura:component>
and handling them in the parent
<aura:component >
<aura:attribute name="children" type="Object[]" default="[]" />
<aura:handler name="initialized" event="registerEvent" action="{!c.register}"/>
<aura:handler name="init" value="{!this}" action="{!c.init}" />
</aura:component>
Controller:
({
register : function(component, event, helper) {
var children = component.get("v.children");
children.push({ "name": event.getParam("name") });
component.set("v.children", children);
},
init: function(component, event, helper) {
var children = component.get("v.children");
console.log("init " + children);
}
})
Register never seems to be called in the parent. Maybe because the parent can't handle events before itsself is inititalized. But that would be to late.
How can I solve this? I read this great article Lightning Inter-Component Communication Patterns about the topic but couldn't find an answer.
UPDATE: The solution can be found in this question Lightning component event not fired or handled and its answer.