Ember adding action to template for parent/child communication

Question

I am trying to define a custom action to my Ember component & want to communicate between parent/child.

In my-child.js, I have

actions: {
    someCustomAction: function() {
        let self = this;
        self.sendAction('someCustomAction');
    },
}

And I catch the same in my-parent.js as below;

actions: {
    someCustomAction: function (){
        console.log("Inside someCustomAction...."); 
    }       
}

Now, with the above code, control/action does not come to my-parent.js

I have to add "someCustomAction" to the template as below

In my-parent.hbs

{{my-child someCustomAction="someCustomAction"}}

I wanted to know the exact reason for the same. Why does just doing sendAction not automtically work ?

Jean-Philippe Roy Jean-Philippe Roy · Accepted Answer · 2017-09-08T12:29:47

Here's how I would go about it while following the data down, actions up (DDAU) pattern.

First, you pass the action you want to fire in your child using the action helper.

{{my-child someActionName=(action 'parentAction')}}

Then, you retreive the action and fire it from the child component.

this.get('someActionName')(params);