Meteor.js: template.<html>.events vs Template.<template>.events 'this' binding seems inconsistent -
i'm looking through meteor simple tutorial , way 'this' binding in different template objects works seems inconsistent me in unknowledgeable state.
template.body.events({ "submit .new-task": function(event) { console.log(this); // logs empty object } }) template.task.events({ "click .toggle-checked": function() { console.log(this); // logs task } }); i can see task xml template defined in view, visual representation of items returned function in template.body.helpers object.
i guess task objects bound html representation of each object (though can't see how there doesn't seem identifying property within li elements??)
anyhow. when click task, this task. when submit form, expecting this body. why not?
i expecting meteor handle template.body , template.task in similar way
in meteor this referes data context. define helpers or route controller ( ironrouter or flowrouter)
example:
{{#with mydata}} <h1>{{title}}</h1> {{/with}} js
template.yourtemplate.helpers({ mydata : function(){ return { title : "my title" } } }) you need use "event" argument
template.task.events({ "click .toggle-checked": function( event , instance ) { console.log( event ); } }); the instance argument useful. have access jquery selector like: instance.$() , search elements on template , child templates.
personally use instance lot. favorite pattern is:
template.task.oncreated(function(){ this.vars = new reactivedict(); this.data = "some data"; }); later if want access vars or data:
- events - on arguments
- helpers -
var instance = template.instance();
with instance avoid storing states in global namespace, session, , code lot easier maintain , understand. hope helps understand how template works in blaze.
Comments
Post a Comment