ember-component-inbound-actions

Send actions to Ember.js components

Usage no npm install needed!

<script type="module">
  import emberComponentInboundActions from 'https://cdn.skypack.dev/ember-component-inbound-actions';
</script>

README

ember-component-inbound-actions

npm version Build Status Ember Version

Send actions to Ember.js components. Inspired by Sam Selikoff's blog post

Questions? Ping me @gavinjoyce

Installation

This is an Ember CLI addon, so all you need to do is

npm install --save-dev ember-component-inbound-actions or ember install ember-component-inbound-actions

Usage Instructions

Add the InboundActions mixin to your component:

import Em from 'ember';
import InboundActions from 'ember-component-inbound-actions/inbound-actions';

export default Em.Component.extend(InboundActions, {
  name: 'Larry David',
  actions: {
    reset: function() {
      this.set('name', '');
    }
  }
});

When declaring your component in a template, include an actionReceiver attribute:

{{name-form actionReceiver=nameForm}}

This allows you to reference the nameForm in your controller and invoke actions on it:

this.get('nameForm').send('reset');

Or use the send helper to invoke actions on your component reference from within the template:

{{name-form actionReceiver=nameForm}}

<button {{action (send nameForm "reset")}}>Reset</button>

Development Instructions

  • git clone this repository
  • npm install
  • bower install

Running

  • ember server
  • Visit your app at http://localhost:4200.