Meteor.js的模板onload事件

Question

我知道Meteor可以暴露像"click"这样的DOM元素事件，但我想知道是否有在加载模板或局部时触发的load事件？我该如何实现？谢谢。

- Gezim

Answer 1

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

在 Template.myTemplate.created 中，DOM 尚未准备好。

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

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

- Joscha

---

自 Meteor 1.0.4 起，Template.myTemplate.rendered 已被弃用。虽然它仍支持向后兼容性，但您可能希望在较新的版本中使用 Template.myTemplate.onRendered。来源 - clemlatz

Answer 2

以下代码应该可以工作。
当模板被添加到 DOM 并渲染后，Meteor.defer 将被调用。

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

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

- Nachiket

---

从版本1.1.0.2开始，这种模式已被弃用。请改用Template.temp.helpers（...）。 - thdoan

Answer 3

我会更推荐这个答案，相较于被接受的答案，我认为这个稍微好一些：

<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();
  });
};

假设您想在模板加载后调用某些内容，因为它正在响应一个响应式对象。

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

- Mike Bannister

---

这实际上是与Nachiket的答案几乎相同。 - Octopus