2012-04-16 10 views
10

私は次のようにいくつかのコードを持って、次のMeteor Template events、イベントの原因となったオブジェクトを取得する方法は?

この状況でmyapp.js

Template.problem.events = { 
'click .problem-text' : function() { 

     var user_id = Session.get('user_id'); 

     // how to get problem_id of clicked item? 
     Router.gotoProblem(user_id, problem_id);  
    } 
}; 

でmyapp.html

<template name="problems"> 
    <div class="problems"> 
     {{#each problems}} 
      {{> problem}} 
    {{/each}} 
    </div> 
</template 

<template name="problem"> 
    <div class="problem"> 
     <div class="problem-text" id={{_id}}>{{text}}</div> 
    </div> 
</template> 

では、私はマッチのIDを取得したいです.problem-textをクリックしました。

イベントを生成した「オブジェクト」について知りたいですか?これはどうすればいいですか?

Template.problem.events = { 
'click .problem-text' : function() { 

     var user_id = Session.get('user_id'); 

     // how to get problem_id of clicked item? 
     Router.gotoProblem(user_id, this._id);  
    } 
}; 
+0

Per Meteorのドキュメントでは、「this」オブジェクトに現在のテンプレートデータを受け取ります。 –

答えて

6

これを試してみてください

Template.problem.events = { 
    /** 
    * Handles problem text click. 
    * @param {jQuery.Event} event 
    */ 
    'click .problem-text' : function (event) { 
     /* 
     Here this is a reference to the problem object 
     and you have jQuery.Event object as the event argument. 
     */ 
     console.log(this, arguments); 

     var user_id = Session.get('user_id'); 
     var problem = this; 

     // how to get problem_id of clicked item? 
     Router.gotoProblem(user_id, /** problem_id */problem._id); 
    } 
    }; 
5

あなたはと、この参照問題のオブジェクトにアクセスすることができます:

+1

これは本当の答えなので、私はupvoted。このようなことのためにセッションを使用するのはハックです。 – cmgriffing

+0

"this"リファレンスは、ヘルパーによって取り出されたオブジェクトからのデータを提供します。私はこの質問がよりhtmlオブジェクトを取得する方法に関連していると思います。その場合、 "event.target"は正しい方法です。しかし、両方のアプローチを念頭に置いてうれしいです。リアクティブデータから再レンダリングするときに、「セッションハック」が使用されることがあります。 –

19

この質問に対する選択した答えはONLY _idを取得しますが、そのあまりにもあれば_idテンプレートで使用されます。

このようにCOMPLETEオブジェクトを与えるevent.targetを使用すると便利です。これはjQueryやMooToolsで使うことができます。

Template.top_nav.events({ 
'mousedown, .nav li a': function(evt){ 
    console.log('the class of object that was clicked is ' + $(evt.target).attr("class")); 
} 
}) 
+2

エラーを防ぐためです。 event.targetを使用すると、クリックされた要素が表示されるので、この例では、リンク上の子であるスパンを返すことができます。 listenしている要素を受け取るには、event.currentTargetを使用します。 – Salketer

関連する問題