如何從組件中的Ember輸入中捕獲輸入事件？

我有一個模件的Ember組件。在情態動詞通常會包含表格，所以我用我的組件keyPressed方法捕捉各種事件，包括任何enter事件（鍵碼13）。這將獲得所有進入事件，除了源自重點{{input}}字段的事件。它看起來像Ember是deliberately blocking these events from bubbling，我可以捕獲輸入中的所有其他按鍵事件。如何從組件中的Ember輸入中捕獲輸入事件？

我一直沒能找到一個乾淨的方式，從我的組件捕捉事件。我不想擴展任何東西並用它來代替，或者在特定的控制器或其他類似的東西上使用動作，因爲他們都覺得應該很簡單，而且看起來像一個明顯的用例。我怎樣才能做到這一點？

編輯：小例子，幫助澄清我的意思了一下。我希望keyPressed在用戶點擊輸入字段時運行。

// 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}} 
    <form> 
     {{input value=foo}} 
    </form> 
{{/my-modal}}

來源

2014-06-24 BenjaminRH

你在說什麼keyPress我沒有看到keyPressed作爲支持的事件（http://emberjs.com/guides/understanding-ember/the-view-layer/#toc_adding-new-events）。

App.MyModalComponent = Ember.Component.extend({ 
    foo:'component', 
    keyPress: function (e) { 
     console.log('asdf'); 
     if (e.which === 13) { 
      console.log('Do something here, like submit the form'); 
     } 
    } 
});

http://emberjs.jsbin.com/ciqomaqo/1/edit

來源

2014-06-24 15:31:35 Kingpin2k

...是的。就是這樣。謝謝！但由於某些原因，'this.sendAction'不能在'keyPress'方法內工作。有任何想法嗎？ – BenjaminRH

你實際上是在模板中定義它時，它鉤了'{{＃我的模態內=「外」}}'，http://emberjs.jsbin.com/ciqomaqo/2/edit – Kingpin2k

其實我只是想出了問題是什麼，而且與其他不相關的東西阻止了工作。再次感謝！ – BenjaminRH

如果它是提交表單，它是有意義的使用瀏覽器的表單提交功能。您也可以使組件元素本身爲一種形式：

Ember.Component.extend({ 
    tagName: 'form', 
    submit: function(e) { 
    e.preventDefault(); // To avoid page reload on event propagation 
    // Do things 
    } 
});

來源

2015-01-29 17:50:52

如何從組件中的Ember輸入中捕獲輸入事件？

回答

相關問題