Question

我试图将OwlCarousel 2.0版与Bootstrap 3和Meteor一起使用。

我为这个轮播创建了一个模板：

<template name="featuredCarousel">
<div class = "row">
    <div class="owl-carousel">
        <div class="item"><h4>1</h4></div>
        <div class="item"><h4>2</h4></div>
        <div class="item"><h4>3</h4></div>
    </div>
</div>
</template>

我将其包含在我的index.html文件中：

<div class="container">
    {{> featuredCarousel}}
</div>

最后，我有一个单独的.js文件来实例化轮播：

$('.owl-carousel').owlCarousel({
loop:true
});

此代码主要是从文档中复制而来的。因此，我希望它能起作用。但是，它根本不显示任何内容。旋转木马似乎是这里的问题，因为当我从div中删除.owl-carousel类时，会显示元素（当然不是在旋转木马中）。

任何人都可以告诉我为什么这不起作用以及如何使其正常工作？我非常感谢你的帮助。

谢谢，

贝

Answer 1

您需要将实例化代码放在渲染的回调中：

Template.featuredCarousel.rendered = function() {
  $('.owl-carousel').owlCarousel({
   loop:true
  });
}

猫头鹰旋转木马没有显示

1 个答案: