title: How can I catch an enter event from an Ember Input in my component?
body: <p>I've got an Ember component for modals. The modals will often contain forms, and so I'm using the <code>keyPressed</code> method in my component to catch various events, including any <code>enter</code> events (keycode 13). This gets all enter events, except ones originating from a focused <code>{{input}}</code> field. It looks like Ember is <a href="https://github.com/emberjs/ember.js/blob/v1.5.0/packages/ember-handlebars/lib/controls/text_support.js#L81" rel="nofollow">deliberately blocking these events from bubbling</a>, and I can catch all the other keypress events from the input.</p>
  
  <p>I haven't been able to find a clean way to catch the event from my component. I don't want to extend anything and use that instead, or use actions on specific controllers, or anything else like that, because they all feel like dirty workarounds for something that should be pretty simple, and also seems like an obvious use-case. How can I do this?</p>
  
  <p>EDIT: little example, to help clarify my meaning a bit. I'd like <code>keyPressed</code> to run when a user hits enter in the input field.</p>
  
  <pre><code>// Relevant section of component
  App.MyModalComponent = Ember.Component.extend({
      // ...
      keyPressed: function (e) {
          if (e.which === 13) {
              console.log('Do something here, like submit the form');
          }
      },
      // ...
  });
  
  // Example of template
  {{#my-modal}}
      &lt;form&gt;
          {{input value=foo}}
      &lt;/form&gt;
  {{/my-modal}}
  </code></pre>