Meteorテンプレートのイベントハンドラでの "this"のコンテキスト（テンプレート用のハンドルバーの使用）

Question

Meteor（ハンドルバー付き）のテンプレートのイベントハンドラのコンテキストに関する簡単な質問。 テンプレートインスタンスオブジェクトが、作成されたこの値として求めレンダリング、イベントの引数としてテンプレートコールバックとを破壊している」と記載されているテンプレートのインスタンス（http://docs.meteor.com/#template_inst）上のドキュメントのセクションで

• ハンドラ「テンプレートセクション（http://docs.meteor.com/#templates）で
• それが言う」最後に、あなたはイベントハンドラのテーブルを設定するテンプレート関数でイベント宣言を使用することができます。形式は、イベント地図で文書化されている。このイベントハンドラへの引数はイベントをトリガーした要素のデータコンテキスト。は「

まあ、これは部分的にしか真であるのは、ドキュメントからの例を使ってみましょう：。ここで

<template name="scores"> 
    {{#each player}} 
    {{> playerScore}} 
    {{/each}} 
</template> 

<template name="playerScore"> 
    <div>{{name}}: {{score}} 
    <span class="givePoints">Give points</span> 
    </div> 
</template 
Template.playerScore.events({ 
    'click .givePoints': function() { 
    Users.update({_id: this._id}, {$inc: {score: 2}}); 
    }); 

『テンプレートは確かである『をクリックし.givePoints』イベントハンドラのこの』文脈playerScoreのインスタンスのは、HTML変更してみましょう：。

<template name="scores"> 
    <span class="click-me">Y U NO click me?<span> 
    {{#each player}} 
    {{> playerScore}} 
    {{/each}} 
</template> 

<template name="playerScore"> 
    <div>{{name}}: {{score}} 
    <span class="givePoints">Give points</span> 
    </div> 
</template> 

を...とスコアテンプレートに.click-私のためのイベントハンドラを追加します。

Template.scores.events({ 
    'click .click-me': function() { 
    console.log(this); 
    } 
}); 

ここでスパンをクリックすると、何が記録されますか？ Windowオブジェクト！私は何を得ることを期待しましたか？テンプレートオブジェクト！あるいは、データコンテキストかもしれませんが、どちらもありません。ただし、コールバック（たとえば、Template.scores.rendered = function（）{...}）では、「this」のコンテキストは常にテンプレートインスタンスです。

私は私の本当の問題は次のようになり推測：これはどこかの間でハンドルバー、流星かに

• でバグを行うに何かありますか？
• テンプレートのドキュメントが少し不完全ですか？
• メテオまたはハンドルバーについて、完全に何かを理解していないか、または何か基本的なものを理解していない

ありがとう！

Answer 1

このビデオでは、概念を説明します。

あなたの質問に直接答え：イベントハンドラ内部

thisArgべきデータコンテキストへポイント。しかし、時にはデータコンテキストはundefinedです。 JavaScriptでFunction.prototype.call(thisArg, ...)を使用するとthisArgが未定義の場合（例：dataContextは未定義です）、ブラウザはthisをwindowと等しく設定します。したがって、ドキュメントはではありません。自体ですが、イベント処理コードはデータコンテキストが未定義になる可能性を防ぐものではありません。私はそれが短期間で修正されると思っています。

テンプレートのデータコンテキストはどのように生成されますか？通常、ルートテンプレートにはデータコンテキストもありません。つまり、Template関数はオブジェクトなしで呼び出されます。しかし、{{#withブロックヘルパーまたは{{#eachイテレータを使用する場合は、リスト内の各項目、またはの場合はヘルパーの場合はオブジェクトにデータコンテキストが作成されます。

例：

var context = {}; 

<template name="withHelper"> 
    {{#with context}} 
    // data context is the context object 
    {{/with}} 
</template> 

var list = [ {name: "one"}, {name: "two"} ]; 

<template name="list"> 
    {{#each list}} 
    {{ > listItem }} // data context set to the list item object 
    {{/each}} 
</template> 

Answer 2

この関数の最初のパラメータはイベントです。イベントのターゲットを使用して要素を取得することができます。

http://www.eventedmind.com/posts/meteor-spark-data-annotation-and-data-contexts：

Template.scores.events({ 
    'click .click-me': function (event, template) { 
    console.log(event.target); 
    $(event.target).text("O but I did!"); 
    } 
});