سؤال

I Have a layout with two alternate templates :

<template name="MyLayout">

    {{#if myBoolean}}
        {{> template1}}
    {{else}}
        {{> template2}}
    {{/if}}

</template>

When I switch my boolean to true (initialized on false), Template.template1.rendered = function () {}; is triggered. But when I switch it to false, the Template.template1.destroyed hook is not triggered. And when I switch it back to true, the Template.template1.rendered event is not triggered either.

The thing is that I use the rendered hook to start a few animations. So my template1 is displayed the first time I switch the boolean to true, but not on the following switches.

Before 0.8, the rendered event was called to much. Now it's a little bit to few. Is there an option or something I can use to destroy my template when it's not in the DOM anymore ?


BTW : to make it work, I still have the ugly solution of putting a helper in the middle of the template1. That helper will be called every time the template is added to the DOM ; so I can start my animations from there. But this is ugly.

هل كانت مفيدة؟

المحلول

The MasterLayout is still there; only the child template has been destroyed. You might be able to use the child template rendered/destroyed handlers. If the animation is only relevant to the parent template elements, you might be able to create an autorun function that starts the animations based on your reactive boolean variable. For example, assuming your boolean is a Session variable (though it will work with any reactive variable):

Deps.autorun(function() {
  if (Session.get("myBoolean")) {
    // start animation
  }
});

Now any time you Session.set("myBoolean", true), the animation will run.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top