title: The context of "this" in Meteor template event handlers (using Handlebars for templating)
body: <p>A quick question on the context of the event handlers for templates in Meteor (with Handlebars). </p>
  
  <ul>
  <li>In the section of Documentation on template instances (<a href="http://docs.meteor.com/#template_inst">http://docs.meteor.com/#template_inst</a>) it is mentioned that "<em>Template instance objects are found as the value of this in the created, rendered, and destroyed template callbacks and <strong>as an argument to event handlers</em></strong>"</li>
  <li>In the Templates section (<a href="http://docs.meteor.com/#templates">http://docs.meteor.com/#templates</a>) it says "<em>Finally, you can use an events declaration on a template function to set up a table of event handlers. The format is documented at Event Maps. <strong>The this argument</strong> to the event handler will be the <strong>data context</strong> of the element that triggered the event.</em>"</li>
  </ul>
  
  <p>Well, this is only partially true. Let's use an example from the docs: </p>
  
  <pre><code>&lt;template name="scores"&gt;
    {{#each player}}
      {{&gt; playerScore}}
    {{/each}}
  &lt;/template&gt;
  
  &lt;template name="playerScore"&gt;
    &lt;div&gt;{{name}}: {{score}}
      &lt;span class="givePoints"&gt;Give points&lt;/span&gt;
    &lt;/div&gt;
  &lt;/template
  Template.playerScore.events({
    'click .givePoints': function () {
      Users.update({_id: this._id}, {$inc: {score: 2}});
    });
  </code></pre>
  
  <p>Here the "this" context of the 'click .givePoints' event handler is indeed the template instance of playerScore. Let's modify the html:</p>
  
  <pre><code>&lt;template name="scores"&gt;
    &lt;span class="click-me"&gt;Y U NO click me?&lt;span&gt;
    {{#each player}}
      {{&gt; playerScore}}
    {{/each}}
  &lt;/template&gt;
  
  &lt;template name="playerScore"&gt;
    &lt;div&gt;{{name}}: {{score}}
      &lt;span class="givePoints"&gt;Give points&lt;/span&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>... and add an event handler for .click-me on the scores template:</p>
  
  <pre><code>Template.scores.events({
    'click .click-me': function () {
      console.log(this);
    }
  });
  </code></pre>
  
  <p>Now, if you click the span, what do you get logged? The Window object! What did I expect to get? The template object! Or maybe the data context, but it's neither. However, inside the callbacks (e.g. Template.scores.rendered = function(){ ... }) the context of "this" is always the template instance. </p>
  
  <p>I guess my real question would be: is this something to do with</p>
  
  <ul>
  <li>a bug in Handlebars, Meteor or somewhere in between?  </li>
  <li>slightly incomplete documentation on the templates?</li>
  <li>me completely misinterpreting the docs or not understanding something fundamental
  about Meteor or Handlebars?</li>
  </ul>
  
  <p>Thanks!</p>