Ich habe eine Reihe von Beiträgen, die ich in einem Karussell anzeigen möchte. Für das Karussell benutze ichEulenkarussell.

    <div class="owl-carousel" id="featured-carousel">
        {{#each featuredPosts}}
        <div>
            <h2>
                {{postTitle}}
            </h2>
        </div>
        {{/each}}
    </div>

Ich nenne mein Karussell so:

Template.featuredCarousel.rendered = function(){
$('#featured-carousel').owlCarousel({
    loop:true,
    autoplay:true,
    autoplayTimeout:3000,
    items:1,
    smartSpeed:1080,
    padding:80
});
this.rendered = true;
};

Das Ergebnis, das ich bekomme, ist, dass Owl im Grunde denkt, ich hätte nur einen Gegenstand im Karussell, bei dem es sich um mehrere Divs handelt. Was anscheinend passiert, ist, dass die Funktion in Template.featuredCarousel.rendered aufgerufen wird, bevor der # Teil der Vorlage abgeschlossen ist oder bevor die Daten angekommen sind.

Wie kann ich die Funktion zum Instanziieren des Karussells erst aufrufen, nachdem die Vorlage einschließlich aller Daten vollständig gerendert wurde?

Vielen Dank für Ihre Hilfe.

P.S .: Ich benutze Iron-Router für das Routing wie folgt:

Router.map(function(){
this.route('home', {
    path: '/',
    waitOn: function(){
        return Meteor.subscribe('featured');
    },
    data: function(){
        return {featuredPosts: Featured.find({})};
    }
});
});

PS: Ich habe auch versucht, eine Ladevorlage zu verwenden, aber das hilft auch nicht.