Ember - クリック時にemberテンプレートからコンポーネントにパラメータとしてhtml要素を渡す

Question

ハンドルバーのonclickアクションで要素オブジェクトを渡すにはどうすればよいですか？私はthisを渡そうとしましたが、うまくいきません。

<a href="javascript:void(0)" onclick={{action "menuClickEvent" this}}>Menu Item</a> 

Component.js

Ember.Component.extend({ 
    actions: { 
    menuClickEvent: function(element) {   
     // need element <a> to do jquery operation 
    } 
    } 
}); 

Answer 1

あなたはそれを渡す必要はありません。要素はイベントtargetのプロパティとしてアクセスできます。あなたが現在componentを渡しているthisを渡すことによって、

<a onclick={{action "menuClickEvent"}}>Menu Item</a> 

。したがって、コードからこのパラメータを削除するだけです。これを削除することができますjavascript:void(0) 90 'もの。 hrefパラメータはHTML5ではオプションであるため、削除することもできます。

Ember.Component.extend({ 
    actions: { 
    menuClickEvent: function(e) {   
     console.log(e.target); // here you go with the `a` element for your black ops 
    } 
    } 
}); 

menuClickEventよりも優れた名前が考えられます。

Answer 2

あなたは提供し、一般的なclick方法のember.jsを使用することができます。

<a>Menu Item</a> 

component.js

export default Ember.Component.extend({ 
    click(event) { 
    console.log(event.target); 
    } 
}); 

を

しかし、ember.jsでDOM要素を直接操作しないでください。元の問題をはるかに優れた方法で解決できると思うので、基礎となるDOM要素に直接アクセスする必要はありません。