Template visualized order: parent triggers in front of child template (s)

Question

I am very new to Meteor, and I am having trouble trying to understand the "rendered" event on templates.

Assuming I have two patterns:

<template name="parent">    
    <div id="list">
        {{#each childs}}
            {{> child}}
        {{/each}}
    </div>
</template>

<template name="child">
    <div class="item">
        <!-- content -->
    </div>
</template>

and these two events:

Template.parent.rendered = function () {
    console.log('parent');
};

Template.child.rendered = function () {
    console.log('child');
};

I always get this from the console:

> parent
> child
> child
> child

In this way, the parent template launches “rendered” before the internal templates finish rendering. Because of this, I cannot perform any post-operations with the DOM, for example, using jquery plugins. eg:

Template.parent.rendered = function () {
    $('#list').myplugin();
};

Since this is done before the internal templates are rendered, it breaks the plugin.

, , , ?

Answer 1

- , - . , , , (, ).

, , , :

, , . , - , , . , . , O (N ^ 2) , - .

---

, , , , , . :

Template.child.rendered = function () {
  if ($('.child').length === Children.find().count()) {
    $('#list').myplugin();
  }
};