Ember.js Cookbook

Handling HTML actions

Often, in an application, we'll need to allow interaction with controls that affect the application state. To accomplish this, we'll use actions.

How to do it...

The {{action}} helper is used on HTML elements to send actions back to the template's corresponding controller or component when the user clicks on an element. Let's take a look at an example of this.

1. Create a new project, navigate to the root of the application directory, and type this command to generate a new component:

   $ ember g component action-component
   

   Keep in mind that all components must have a dash in their names. This will generate the component template, JavaScript files, and test files.

2. Edit the action-component.js file in the components folder. We'll add ...