Calling Embedded Lightning Component from the Parent Lightning Component

Question

I have a Lightning component (parent), and it has another Lightning component embedded within it:

<aura:component implements="forceCommunity:availableForAllPageTypes" access="global">

  <!-- markup above -->
    <c:CaptchaComponent aura:id="captcha" />
  <!-- markup below-->

</aura:component>   

The CaptchaComponent has a button (aura:id="myButton"). I want to be able to enabled/disable that button from the parent Lightning component's controller. I was hoping to be able to do something like this:

var captchaCmp = component.find("captcha");
captchaCmp.myButton.set("v.diabled", false);

What's the correct way of calling that from the parent component?

Answer 1

You can use an aura:method to achieve this. In the aura method defined in your child component's JavaScript (controller/helper), you can set an attribute which will in turn enable/ disable the button. Please refer the below link to learn more about aura:method.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/ref_tag_method.htm