9

我有一个看起来像这样的模板：

<template name="foo">
  <textarea name="text">{{contents}}</textarea>
</template>

我用以下方式渲染它：

Template.foo = function() {
  return Foos.find();
}

我有一些事件处理程序：

Template.foo.events = {
  'blur textarea': blurHandler
}

我想要做的是根据其内容的大小设置rows属性。textarea我意识到我可以编写一个 Handlebars 助手，但它无法访问正在呈现的 DOM 元素，这将迫使我做一些不必要的重复。理想情况下，我想要的是让流星在渲染元素后触发事件。就像是：

Template.foo.events = {
  'render textarea': sizeTextarea
}

这可能吗？

4

4 回答 4

21

从 Meteor 0.4.0 开始，可以检查模板是否已完成渲染，请参阅http://docs.meteor.com/#template_rendered

如果我正确理解您的问题，您应该将您的 textarea 调整大小代码包含在 Template.foo.onRendered 函数中：

Template.foo.onRendered(function () {
  this.attach_textarea();
})
于 2012-09-05T16:44:58.523 回答
16

我认为当前的“最佳”方法（这有点像 hack）是在 Meteor.js 中更新 DOM 之后Meteor.defer使用ala Callback 。

杰夫是流星的开发者之一，所以他的话就是福音：）

因此，在您的情况下，您可以执行以下操作：

 <textarea id="{{attach_textarea}}">....</textarea>

和

 Template.foo.attach_textarea = function() {
   if (!this.uuid) this.uuid = Meteor.uuid();

   Meteor.defer(function() {
     $('#' + this.uuid).whatever();
   });

   return this.uuid;
 }

编辑

请注意，作为 0.4.0，您可以以非常特别的方式执行此操作（如 Sander 所指出的）：

Template.foo.rendered = function() {
  $(this.find('textarea')).whatever();
}
于 2012-06-14T00:09:50.863 回答
2

自 2014 年 6 月左右以来，正确的做法是使用 Template.myTemplate.onRendered()设置回调。

于 2015-05-27T23:28:23.420 回答
0

是的，我想是的-不确定这是否是“正确的方式”，但这对我有用：

在您的应用程序 JS 中，客户端部分将在客户端上运行任何 javascript。例如：

if (Meteor.is_client) {
    $(function() {
        $('textarea').attr('rows' , 12) // or whatever you need to do
    })
    ...

请注意这里的示例使用 JQuery，在这种情况下，您需要将其提供给客户端（我认为 :-)。就我而言：

我创建了一个 /client 目录，并在其下添加了 jquery.js 文件。

希望这可以帮助。

于 2012-06-13T23:39:45.790 回答