<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
<aura:attribute name="firstName" type="String" />
<aura:registerEvent name="contactDataEvent" type="c:ChildParentEvent"/>
<lightning:input
aura:id="input1"
type="text"
name="input2"
label="First Name"
value="{!v.firstName}"
onchange="{!c.searchKeyChange}"
placeholder="Search"/> <br />
</aura:component>
({
searchKeyChange : function(component, event, helper) {
var cmpEvent = component.getEvent("ChildParentEvent");
cmpEvent.setParams({"firstName" : component.find('input1').get('v.value')});
cmpEvent.fire();
alert('Event fired');
console.log("cmpEvent Event Fired");
}
})
ParentCompo:-
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" > <aura:attribute name="receivedFromChild" type="String" />
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
<aura:attribute name="receivedFromChild" type="String" />
<aura:handler name="contactDataEvent" event="c:ChildParentEvent" action="{!c.receiveDataController}"/>
<div class="slds-m-around_xx-large">
<c:childCompo /> <br />
Received value from Child = <ui:outputText value="{!v.receivedFromChild}" />
</div>
</aura:component>
</aura:component>
ParentController:-
({
receiveDataController : function(component, event, helper) {
var receivedData = event.getParam("firstName");
console.log("Received from Child = ", receivedData);
component.set('v.receivedFromChild' , receivedData);
}
})
({
receiveDataController : function(component, event, helper) {
var receivedData = event.getParam("firstName");
console.log("Received from Child = ", receivedData);
component.set('v.receivedFromChild' , receivedData);
}
})
<aura:event type="COMPONENT" description="Event template" >
<aura:attribute name="firstName" type="String" />
</aura:event>