Meteor.js 范围问题

Question

我的大部分编码都在根目录下的[appname].js 中进行，并且在 app/client/compatibility 中进行了一些第三方库

我能够加载这些库，并在我的 Template.template1.rendered 处理程序中从它们声明和实例化对象，效果很好。

但是，当我想修改Template.template2.events 中的一个变量时，特别是选择器更改时的事件。当我尝试从这里更改它时，它告诉我我的变量未定义。

我尝试在文件顶部的isClient 中声明变量，但这似乎并不重要。没有在那里定义它的场景。

所以我的问题是如何在我的Template.template2.events 中修改这个变量？

var something;

if ( Meteor.isClient ) {

  function doSomething(some, value) {
    some.property = value;
  }

  Template.template1.rendered = function() {
    if(!this._rendered) {
      this._rendered = true;
      this.something= thirdParty.Create();
      doSomething(this.something, document.getElementById("text").value);
    }
  }

  Template.template2.events({
    "change select" : function( event ) {
      doSomething(this.something, input );
    }
  });

从我的change select 事件调用时，doSomething 函数中的something 显示未定义。

Answer 1

我认为问题不是范围而是上下文。在您的rendered 函数（您现在应该使用onRendered() 回调）中，this 的值设置为正在呈现的模板实例： http://docs.meteor.com/#/full/template_onRendered

另一方面，在您的模板事件（和助手）中，this 的值设置为数据上下文 - 不是模板对象。但是，您可以访问模板实例，因为它作为第二个参数传递给您的事件映射函数： http://docs.meteor.com/#/full/eventmaps

您在代码中想要的范围并不完全清楚。但是，您当前的代码包括：

var imageViewer;

以上是在本地文件范围内声明的（但可以关闭）

Template.ocr_results.rendered = function() {
  this.imageViewer = thirdParty.Create();
}

以上被声明为刚刚渲染的模板实例的属性（ocr_results 的一个实例）。

Template.ocr_form.events({
  "change select" : function( event ) {
    changeImage(this.imageViewer, input );
  }
});

上面对this.imageViewer 的引用未定义有两个原因。首先，this 是数据上下文，而不是模板实例。其次，即使您编写了以下代码来使用模板实例，它也会引用 ocr_form 模板实例，而不是 ocr_results 模板实例（这是您在上面的第二个代码块中定义它的位置。

Template.ocr_form.events({
  "change select" : function(event, template) {
    changeImage(template.imageViewer, input );
  }
});

以上仍然是未定义的。

正如@Curtis 所建议的那样，您可能应该删除 both 您的 this. 前缀以使您的代码正常工作，但只创建和使用（封闭）变量可能不是您想要的之后 - 因此是冗长的解释！