Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
@ M Coder@ M Coder 

Communication using Aura:attribute

how to send list<strings> from parent component  to child component  using aura attribute in lightning
 (note : I dont want aura methods or events ) 
Best Answer chosen by @ M Coder
Naveen KNNaveen KN
If you are looking to pass the list of strings, Try the below code

ParentComponent.js

<aura:component implements="flexipage:availableForRecordHome" access="global" >
    <aura:attribute name="ParentAtt"  type="String[]" default="['red','green','blue']"/>
    <div style='border: 1px solid black; padding:20px;'>
        <div>parent component!</div>
        <c:ChildComponent ParAttValue = '{!v.ParentAtt}' />
    </div>
</aura:component>

ChildComponent.js

<aura:component  implements="flexipage:availableForRecordHome" access="global">
    <aura:attribute name="ParAttValue" type="String[]"/>
    <div style='border: 1px solid black; padding:20px;'>
        <span>Child component! </span>
        <br/>
        <span>list of string from the parent are below</span>
        <aura:iteration items="{!v.ParAttValue}" var="s">
            <br/>
            {!s}
        </aura:iteration>
    </div>
</aura:component>

and the output is here

User-added image

 

All Answers

VinayVinay (Salesforce Developers) 
Hi,

Try to use aura:attribute,  parent component can initialize child component.

Please find sample snippet:

 ChildComponent.cmp:
==================
    
<aura:component>
    <aura:attribute name="firstName" type="String"/>
        <aura:attribute name="lastName" type="String"/>
</aura:component>

Parent Component.cmp:
===================
    
<aura:component>
    <c:ChildComponent firstName="John" lastName="Doe"/>
</aura:component>

Set values while adding component in any parent component.

Please review below links for more detail information.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/components_attributes.htm
https://developer.salesforce.com/blogs/developer-relations/2017/04/lightning-inter-component-communication-patterns.html

Hope above information was helpful.

Please mark as Best Answer so that it can help others in the future.

Thanks,
Vinay Kumar
Naveen KNNaveen KN
If you are looking to pass the list of strings, Try the below code

ParentComponent.js

<aura:component implements="flexipage:availableForRecordHome" access="global" >
    <aura:attribute name="ParentAtt"  type="String[]" default="['red','green','blue']"/>
    <div style='border: 1px solid black; padding:20px;'>
        <div>parent component!</div>
        <c:ChildComponent ParAttValue = '{!v.ParentAtt}' />
    </div>
</aura:component>

ChildComponent.js

<aura:component  implements="flexipage:availableForRecordHome" access="global">
    <aura:attribute name="ParAttValue" type="String[]"/>
    <div style='border: 1px solid black; padding:20px;'>
        <span>Child component! </span>
        <br/>
        <span>list of string from the parent are below</span>
        <aura:iteration items="{!v.ParAttValue}" var="s">
            <br/>
            {!s}
        </aura:iteration>
    </div>
</aura:component>

and the output is here

User-added image

 
This was selected as the best answer