在渲染模板之前调用 Meteor JS 模板渲染函数？

Question

我正在尝试在 JQuery UI 中使用 Buttonset 小部件。我已经加载了包，并且我的模板可以很好地呈现单选按钮。我有一个“渲染”函数来调用 JQ UI 例程来设置按钮集：

Template.teamList.rendered = function () {
    $("#buttonsetID").buttonset();
}

但是看起来渲染的函数在模板被渲染之前被调用了！我在函数中粘贴了一个console.log，它会在屏幕上出现任何内容之前打印到控制台。所以没有设置任何单选按钮，因此 .buttonset() 调用什么也不做。如果我在呈现页面后在控制台中进行该调用，JQuery UI 会做正确的事情并出现我的按钮集。

.rendered 函数不是应该在一切设置好后调用吗？我做错了吗？

谢谢！

编辑：

例如，在排行榜示例中可以看到同样的情况。

如果添加：

  Template.leaderboard.rendered = function() {
     alert($('.player').length);
  }

当页面显示时，它将显示 0。如果您需要添加一些 JQuery 事件，或者在本例中为 JQuery UI 元素，这使得访问 DOM 项目变得困难。

Answer 1

rendered 仅适用于第一次将模板添加到页面时将出现在 DOM 中的元素。假设订阅数据需要无限长的时间才能到达，然后查看模板，看看哪些元素会以默认状态出现。

使用leaderboard 示例，我们不能假设玩家在排行榜模板呈现时可用（这取决于订阅）。要定位播放器，您应该在播放器模板上使用rendered 回调。

很难概括何时应用 jQuery 插件的策略，但这里有一些想法：

• 如果元素将始终以默认状态添加（例如，元素是硬编码且不依赖于条件），则使用 rendered 回调。

• 使用最具体子模板的rendered回调来定位该子模板（例如上面的播放器模板）。

• 如果元素的外观取决于事件（例如按钮单击），请考虑使用 event handler 回调来定位元素。

• 如果元素的外观取决于反应状态，请考虑使用template autorun 回调来定位元素。示例见this question。