Why Won't my component click

application.controller.js

import Ember from 'ember';

export default Ember.Controller.extend({
  didIClick: 'No Clicks!',
  actions: {
    otherAction(){
      alert('controller action');
      return true;
    }
  }
});

application.route.js

import Ember from 'ember';

export default Ember.Route.extend({

  actions: {
    otherAction(){
      alert('route action');
    }
  }
});

application.template.hbs

 <table class='hoverable bordered'>
	<thead>
    <tr class='active'>
      <th>oh</th>
      <th>hey</th>
      <th>there</th>
      <th>yo</th>
    </tr>
	</thead>
  <tr>
  	<td>OUTSIDE</td>
    {{pseudo-row didIClick=didIClick otherAction='otherAction'}}
  </tr>
</table>  

<br />
<h4>Click the purple component</h4>

{{didIClick}}

pseudo-row.component.js

import Ember from 'ember';
let uuid = 0;
export default Ember.Component.extend({
  tagName: '',
  actions: {
    clicked: function() {
      this.sendAction('otherAction');
      //this.set('didIClick', 'Clicked!! ' + (uuid++));
    }
  }
});

pseudo-row.template.hbs

<td {{action 'clicked'}} class='deep-purple lighten-5'>Stuff</td>
<td {{action 'clicked'}} class='deep-purple lighten-5'>and</td>
<td {{action 'clicked'}} class='deep-purple lighten-5'>things</td>

styles.app.css

th{}
.erm{
  
}

twiddle.json

{
  "version": "0.4.9",
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.9/ember.js",
    "ember-data": "https://cdnjs.cloudflare.com/ajax/libs/ember-data.js/1.13.11/ember-data.js",
    "ember-template-compiler": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.9/ember-template-compiler.js",
    "materialize": "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css"
  }
}