Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Action bubbling from components
import Ember from 'ember';
export default Ember.Component.extend({
layout: Ember.computed.alias('contentTemplate'),
import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
export default Ember.Controller.extend({
appName: 'Ember Twiddle',
result: '',
myContentTemplate: hbs('<button class="btn" {{action "testAction"}}>Click me</button>'),
actions: {
testAction() {
this.set('result', 'TestAction called.');
<h1>Welcome to {{appName}}</h1>
{{my-component contentTemplate=myContentTemplate}}
<p>Using ember 2.8.0 this works, using "release" (currently 2.8.2) the component logs an error.</p>
<div class="alert alert-danger"><pre>VM188 ember.debug.js:6778 Uncaught Error: Assertion Failed: &lt;twiddle@component:my-component::ember355&gt; had no action handler for: testAction</pre></div>
"version": "0.10.5",
"EmberENV": {
"options": {
"use_pods": false,
"enable-testing": false
"dependencies": {
"jquery": "",
"ember": "release",
"ember-data": "2.8.0",
"ember-template-compiler": "release",
"ember-testing": "release",
"ember-cli-htmlbars-inline-precompile": "^0.3.5"
"addons": {}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment