Reducing “action cruft” in your Ember templates

clean-template.hbs

{{post-detail post=post}}

component.js

// app/components/post-detail.js
import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    startEditing: function () {
      this.get('targetObject').send('startEditing', this.get('model'));
    }
  }
});

controller.js

// app/controllers/posts/show.js
import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
    startEditing: function (post) {
      // Perform the logic to start editing the post
    }
  }
});

messy-template.hbs

{{post-detail post=post
  closeModal='closeModal'
  startEditing='startEditing'
  stopEditing='stopEditing'
  publish='publish'
  save='save'}}