如何在#each完成后执行回调？ [英] How to execute a callback after an #each is done?

问题描述

#each 完成后，我遇到回调问题。我有一个名为content的模板：

I'm having trouble with a callback after the #each has finished. I have a template named "content":

<template name="content">
{{#if Template.subscriptionsReady}}
    {{#each currentData}}
        <div data-cid="{{this._id}}"></div>
    {{/each}}
{{else}}
    Loading...
{{/if}}
</template>

首先我等待订阅，如果可用，我用<$迭代我的收藏c $ c> {{＃each}} 并附加 div 。我需要的是for-each循环完成时的一种回调（换句话说就是DOM就绪）。

At first I wait for a subscription, when this is available, I iterate through my Collection with {{#each}} and append the div. What I need is a sort of callback for when the for-each loop is done (in other words DOM ready).

Template.content.onRendered()

- >触发到早期

我还尝试在{{each}}之后追加一个图像并在其 onload 中触发一个函数，如下所示：

I also tried appending an image after the {{each}} and fire a function in its onload like this:

<img style="height:0;width:0" src="*mysource*" onload="callback()">

- >有时工作但不可靠某种方式

-> did work sometimes but not reliable somehow

有没有办法获得此回调？我不担心改变这个模板的结构，如果它带来了解决方案。

Is there a way to get this callback? I do not fear to change the structure of this template, if that brings the solution.

推荐答案

我有类似的问题，之后很多搜索发现了以下解决方案。我尝试使用 Tracker ， onRendered 和其他技巧，但都没有奏效。这可以被视为更多的黑客，但有效。不幸的是不记得我最初在哪里找到了这个解决方案

I had a similar problem and after a lot of searching found the following solution. I tried using Tracker, onRendered and other tricks, none of them worked. This could be considered more of a hack, but works. Unfortunately can't remember where I found this solution initially.

从模板开始，但在每个之后添加模板标签。

Start with your template, but add an template tag after your each.

<template name="content">
{{#if Template.subscriptionsReady}}
    {{#each currentData}}
        <div data-cid="{{this._id}}"></div>
    {{/each}}
    {{doneTrigger}}
{{else}}
    Loading...
{{/if}}
</template>

然后定义一个返回null的助手。

Then define a helper that returns null.

Template.content.helpers({
  doneTrigger: function() {
    Meteor.defer(function() {
      // do what you need to do
    });
    return null;
  }
});

您可以阅读更多关于 Meteor.defer（） 此处，但相当于使用0毫秒 setTimeout 。

You can read more about Meteor.defer() here, but it is equivalent to using a 0 millisecond setTimeout.

这篇关于如何在#each完成后执行回调？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！