I need swipe horizontally with dynamic data in meteor, but it still not simply working, any idea? My code:
<template name='gallery'>
<div class="swiper-container" id="swiper-container1">
<div class="swiper-wrapper">
<div class="swiper-slide">
{{#each gallery_images}}
<div style="background-image:url(data:image/png;base64,{{base64encoded}})"></div>
{{/each}}
</div>
</div>
</div>
</template>
This is the helper function and swiper registration
Template.gallery.helpers({
gallery_images: function(){
return Images.find();
}
});
Meteor.startup(function(){
console.log('Initial Swiper');
var swiper = new Swiper('.swiper-container',{
resistance : '100%',
createPagination:false,
loop: false
});
swiper.reInit();
});
Instead of
Use;
The DOM is not populated with all the div's at startup, that only happens after the template has been rendered with the data from
{{#gallery_images}}
and not until then can younew
the Swiper class