meteor.js 的模板 onload 事件答案

【问题标题】：Template onload event for meteor.jsmeteor.js 的模板 onload 事件
【发布时间】：2012-06-25 09:54:57
【问题描述】：

我知道meteor会为DOM元素公开诸如“点击”之类的事件，但我想知道在加载模板或部分时是否会触发加载事件？我将如何做到这一点？

谢谢。

【问题讨论】：

标签： javascript meteor

【解决方案1】：

对于 Meteor 从 0.4.0 预览版开始，您可以使用Template.myTemplate.created。

然而，在Template.myTemplate.created 中，DOM 还没有准备好。

如果您需要操作 DOM，您可能希望改用 Template.myTemplate.rendered 并使用布尔值来跟踪 Template 对象中的状态，如下所示：

Template.myTemplate.rendered = function() {
    if(!this._rendered) {
      this._rendered = true;
      console.log('Template onLoad');
    }
}

【讨论】：

Template.myTemplate.rendered 自 Meteor 1.0.4 起已弃用。虽然它仍然支持向后兼容，但您可能希望将Template.myTemplate.onRendered 用于较新的版本。 Source

【解决方案2】：

我会推荐这个而不是接受的答案，恕我直言，略少：

<template name="temp">
    {{aReactiveHelper}}
</template>

Template.temp.aReactiveHelper = function() {
  var someValue = Session.get('someValue');
  invokeAfterLoad();
  return someValue;
};

var invokeAfterLoad = function () {
  Meteor.defer(function () {
     $('mydiv').doSomething();
  });
};

假设您想在模板加载后调用某些内容，因为它正在对反应性对象做出反应。

这里的好处是您无需将动画代码添加到您的模板中。

【讨论】：

这与 Nachiket 的答案几乎相同

【解决方案3】：

以下应该可以工作。
一旦将模板添加到 DOM 并渲染，Meteor.defer 就会被调用。

<template name="temp">
    //regular stuff
    {{invokeAfterLoad}}
</template>

Template.temp.invokeAfterLoad = function () {
  Meteor.defer(function () {
     $('mydiv').jquerify();
  });
  return "";
};

【讨论】：

从 v1.1.0.2 开始，此模式已被弃用。请改用Template.temp.helpers(...)。