Yielding Actions

app_components_my-button.js

import Ember from 'ember';

export default Ember.Component.extend({
  tagName: 'button',
  click: function() {
    // In Ember 2.0, actions are just regular functions passed as 
    // parameters to components. You will be able to invoke them
    // by just calling them, like this:
    var action = this.get('action');
    if (action) {
      action('they clicked me');
    }
  }
});

app_components_sample-parent.js

import Ember from 'ember';

export default Ember.Component.extend({
  // Nothing special here, just a familiar action handler.
  actions: {
    submit: function(msg) {
      alert("yay " + msg);
    }
  }
});

app_helpers_make-action.js

import Ember from 'ember';

// This is a helper that lets you package up an action 
// from the current context so you can pass it elsewhere.
// The Ember 2.0 RFC says that {{action "foo"}} will 
// work this way, but in 1.0 it has a different meaning, so I
// named this one `make-action` instead.
export function makeAction(params) {
  var actionName = params[0];
  return (...args) => {
    this.send(actionName, ...args);
  };
}

export default Ember.HTMLBars.makeBoundHelper(makeAction);

app_templates_components_sample-parent.hbs

{{!-- This parent component yields one value -- a function returned
    from the make-action helper. --}}
{{yield (make-action "submit")}}

{{!--
  The above example yields the action, but you can also just
  pass it directly to a component too:
   
   {{some-other-component something=(make-action "other")}
--}}

example.hbs

{{!-- Here's how it all goes together --}}
{{#sample-parent as |submit|}}
  {{#my-button action=submit}}Go{{/my-button}}
{{/sample-parent}}

Can I have your options on my comment here? emberjs/ember.js#4985 (comment)

I think this gist is old, and probably there should be a better way of doing it. Thanks for reviewing.