從Ember.js控制器中的操作獲取元素

Question

如何使用Ember.js從文本區域中的操作獲取元素？

該代碼不起作用：

App.EnquiryBreakfastController = Ember.ObjectController.extend({
  actions: {
    grow: function(event){
      console.log(this.get('element'));
    }
  }
});

.copy
  %h2 Tell us about your breakfast? 
.enquiry__grid
  {{textarea key-press="grow" value=project placeholder="Water and Bread" class="enquiry--input enquiry--input--area" cols='25' rows='1'}}
.enquiry--button
  {{#link-to 'enquiry.budget' class="btn"}}Next{{/link-to}}

Answer 1

您無法從控制器獲取元素，因為它沒有對模板的任何引用。 相反，您需要將文本區域包裝在自定義組件中並綁定到按鍵事件。

此示例使用ES6模塊導出，因為這是ember-cli現在的標准。

應用程序/組件/成長，textarea.js

export default Ember.TextArea.extend({
  grow: function(event) {
    // Your logic here
  }.on('keyPress')
});

然后在您的模板中：

{{grow-textarea value=project placeholder="Water and Bread" class="enquiry--input enquiry--input--area" cols='25' rows='1'}}