Meteor how to load the script at the end of the template

Question

I have a template that looks like this. It used to work with regular html file, however, it is not working now.

This is my test.html file.

<template name="test">
<a href="xxxxxxxx" class="screenshot">
    <img src="xxxxxx" alt="Screenshot" class="thumbnail"/>
    <span class="screenshot-zoom"></span>
</a>
<script>
    $(function () {
        $(".screenshot").lightbox();
    });
</script>
</template>

EDIT1

I follow https://stackoverflow.com/a/10119993/772481 and try similar test, but still not working.

->test.html
<template name="test">
    <a href="./img/screenshots/placeholder.gif" class="screenshot">
        <img src="http://placehold.it/300x120" alt="Screenshot" class="thumbnail"/>
        <span class="screenshot-zoom"></span>
        {{add_my_special_behavior}}
    </a>
</template>

->screenshot.js
Template.test.add_my_special_behavior = function () {
    Meteor.defer(function () {
        // do stuff to it
        $(".screenshot").lightbox();
    });
    // return nothing
};

http://stackoverflow.com/questions/10109788/callback-after-the-dom-was-updated-in-meteor-js check this — crapthings, Aug 18 '12 at 04:58
@crapthings Thanks. I tried it. But it doesn't seem to work. — angelokh, Aug 18 '12 at 06:30
script load order http://stackoverflow.com/questions/10693113/dependencies-between-javascript-files-in-meteor — Lloyd, Aug 22 '12 at 10:54

score 1 · Answer 1 · answered Dec 22 '12 at 13:46

1

Use the rendered event available to your template:

Template.test.rendered = function() {
  $(".screenshot").lightbox();
}

This will execute the lightbox method after Meteor has rendered the template.

answered Dec 22 '12 at 13:46

Rahul

12,181
5
43
64

Meteor how to load the script at the end of the template

1 Answers1