javascript Meteor.js：如何从事件调用辅助方法？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27304409/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Meteor.js: how to call helper method from event?
提问by T3db0t
I suspect I'm not doing this the Meteor way. I'm making a shared, interactive calendar.
我怀疑我不是按照 Meteor 的方式来做这件事的。我正在制作一个共享的交互式日历。
I have a calendar template:
我有一个日历模板：
<template name="calendar">
<h2>Calendar</h2>
<div class="calendar">{{#each days}}
{{> day}}
{{/each}}
</div>
</template>
With a helper that returns a day object:
使用返回 day 对象的助手：
{
date: thisDate.getDate(),
dateString: dateString,
done: done,
today: isToday
}
I have a day template:
我有一个日模板：
<template name="day">
<div class="day {{stateString}}">{{date}}</div>
</template>
With some helpers (meetingIDis hardcoded for now for development):
使用一些助手（meetingID现在硬编码用于开发）：
Template.day.helpers({
state: function(){
// retreive from DB
var s = Meetings.findOne({"_id":meetingID}).dates[this.dateString];
return s;
}
stateString: function(){
var stateString;
switch(this.state){
case -1: stateString = "unknown"; break;
case 0: stateString = "unavailable"; break;
case 1: stateString = "available"; break;
}
if(this.done) stateString = "done";
return stateString;
}
});
state() gets the state from the db and stateString() picks the right class name for that state.
state() 从数据库中获取状态， stateString() 为该状态选择正确的类名。
When you click on it, you cycle through states (1: available, 0: not available, -1: unknown):
当你点击它时，你会在状态之间循环（1：可用，0：不可用，-1：未知）：
Template.day.events({
"click": function(){
if(this.done) return false; // no state changes for past days!
console.log(e);
var newState = this.state + 1;
if(newState > 1) newState = -1;
var q = "dates."+this.dateString+"."+Meteor.userId()+".state";
console.log(q+ " / "+this.state+" / "+newState);
Meetings.update(meetingID, {$set:{q:newState}});
return false;
}
})
I'm having at least two specific problems:
我至少有两个具体问题：
1) How do I call the state() helper from the click event? 2) My db update doesn't seem to work—it's creating a 'q' document instead of using the string stored in q.
1) 如何从点击事件中调用 state() 助手？2) 我的数据库更新似乎不起作用——它正在创建一个“q”文档，而不是使用存储在 q 中的字符串。
I'm sure this is missing some fundamental understanding of the right way to do this—please help!
我确信这缺少对正确方法的一些基本理解 - 请帮助！
采纳答案by sbking
Just expanding on the answer by @mark. You probably want to store stateas a reactive variable so that your stateStringhelper will update when the state changes. If I understand correctly, you are not actually trying to use the statehelper in your template - it is just needed for the string helper and the event. First add the reactive-varpackage:
只是扩展@mark 的答案。您可能希望将其存储state为反应变量，以便您的stateString助手在状态更改时进行更新。如果我理解正确，您实际上并没有尝试state在模板中使用帮助程序——它只是字符串帮助程序和事件所需要的。首先添加reactive-var包：
meteor add reactive-var
I would recommend doing something like this for your template:
我建议为您的模板做这样的事情：
Template.day.created = function() {
this.state = new ReactiveVar();
this.autorun(_.bind(function() {
var meetingDates = Meetings.findOne(meetingID).dates[this.data.dateString];
var currentState = meetingDates[Meteor.userId()].state;
this.state.set(currentState);
}, this);
};
Template.day.helpers({
stateString: function() {
if (this.done) {
return 'done';
}
switch(Template.instance().state.get()) {
case -1: return 'unknown';
case 0: return 'unavailable';
case 1: return 'available';
}
}
});
Template.day.events({
'click': function(event, template) {
if (this.done) {
return;
}
var newState = template.state.get() + 1;
if (newState > 1) {
newState = -1;
}
var modifier = {$set: {}}
modifier.$set['dates.'+this.dateString+'.'+Meteor.userId()+'.state'] = newState;
Meetings.update(meetingID, modifier);
}
});
回答by Adam Moisa
Access template helpers from anywhere:
从任何地方访问模板助手：
Template.<name>.__helpers.get('<helper>').call()
回答by mark
Off the top of my head, one way to persist data between helpers and events in the same template is to store it as a property inside the template instance. So for example, you might have something that looks like this:
在我的脑海里，在同一个模板中的助手和事件之间持久化数据的一种方法是将它作为一个属性存储在模板实例中。因此，例如，您可能有如下所示的内容：
Template.day.created = function () {
// here `this` refers to template instance
this.state = -1;
};
Template.day.helpers({
state: function () {
var s = Meetings.findOne({"_id":meetingID}).dates[this.dateString];
Template.instance().state = s;
return s;
},
...
});
Template.day.events({
'click': function () {
...
var state = Template.instance().state;
...
}
});
As for the issue with q, you have to construct the object prior, otherwise qwill be interpreted as the actual field name rather than a variable (notice how there's no distinction between "q" and q inside the query).
至于 的问题q，您必须先构造对象，否则q将被解释为实际的字段名称而不是变量（请注意查询中的“q”和 q 之间没有区别）。
var query = {};
query[q] = newState;
Meetings.update(meetingID, { $set: query });
Hope this helps!
希望这可以帮助！
