Meteor: Dynamic image in template

Question

Is it possible to create a template with a dynamic loading image?

template

<template name="example">
    <img src="{{src}}">
</template>

helper

Template.example.helpers({
    src: function() {
        return Collection.findOne({}, { sort: { timestamp: -1 }}).url;
    }
});

As you can see the src-url is stored in a collection document and I always choose the newest document of the collection.

But if I insert a new document in that collection nothing happens until I do a reload of the page.

Answer 1

MongoDb cursors are reactive not the data itself. In your helper you are basically fetching one document from the database using findOne() . findOne() get one document and closes the cursor. You can try find() with limit and show it in the dom using #each property of Blaze.

Collection.find({}, {limit:1 , sort: { timestamp: -1 }});

{{#each src }}
    <img src="{{src.url}}">
{{/each}}