Lightning Component: Invoke a function on parent from child component

Question

I have a component that invokes another component. It looks like this:

<aura:component >
<c:dummycomponent
    label="Test Amount"
    elements="{!v.elems}"
    data="{!v.amount}"/>
</aura:component>

What I want to do next is when information in the dummycomponent changes a function inside the parent component's helper gets invoked.

I tried putting <aura:attribute name="onChange" type="Aura.Action" description="handles change events"/> inside the dummycomponent and then modify the code above to:

<aura:component >
<c:dummycomponent
    label="Test Amount"
    elements="{!v.elems}"
    data="{!v.amount}"
    onchange="{!v.testfunction}" />
</aura:component>

This did not work and I am not sure what I can try next. Any help will be appreciated, thank you.

Answer 1

If the parent is simply concerned about getting notifications on its data changing, you can use an aura:valueChange event in the parent directly:

<aura:component>
  <aura:handler name="change" value="{!v.elems}" action="{!c.valueChanged}" />
  <c:dummycomponent...>
</aura:component>

If you want to do it as an event from the child, then you've got to go down the path of using aura:registerEvent in the child component, which ultimately means you have to fire the change event manually, in which case you can then use the onchange mechanism from your original post.

In your child component:

<aura:registerEvent name="onchange" type="aura:valueChange" />

And in your controller code:

fireChangeEvent: function(component, event, helper) {
  var valueChangeEvent = component.getEvent("onchange");
  valueChangeEvent.setParams(
    // set desired values here
  );
  valueChangeEvent.fire();
}

Answer 2

Lightning component doesn't work that way. You can't invoke parent component's method in a child component. What you need to do here is to use events. You can publish an event at child component and in the parent component listens to respond to that event.

You can refer to this trailhead: https://trailhead.salesforce.com/en/lex_dev_lc_basics/lex_dev_lc_basics_events