Javascript 切换页面后Bxslider已损坏

我正在尝试向meteor.js项目添加一个滑块

我目前正在使用Bxslider，我只想在im处于特定路由时显示滑块，它在第一次加载时可以完美工作，但当我添加zimme:active route:

{{#if isActivePath '/'}}

{{/if}}

滑块显示一个叠在另一个上面的图像

这就是代码：

模板代码：

{{#if isActivePath '/'}}
        <div class="col-md-3 slider" >
            <ul class="bxslider">
                <li><img class="img-responsive" src="/assets/tds/img/15.jpg" /></li>
                <li><img class="img-responsive" src="/assets/tds/img/16.jpg" /></li>
                <li><img class="img-responsive" src="/assets/tds/img/17.jpg" /></li>
            </ul>
        </div>
{{/if}}

})

我想问题是：当我切换页面时，条件“if”覆盖了当前的slider div，但我不知道如何修复它，有什么建议吗

第一次加载页面时的滑块：

切换页面后：

---

为了有更好的机会得到答案，你能把你得到的图片贴出来吗？如果你没有足够的代表来做这件事，那么把它发布在imgur上，并用链接编辑这个问题。为了有更好的机会得到答案，你可以发布你得到的图片吗？如果你没有足够的代表来做这件事，那么把它发布在imgur上，并用链接编辑问题。

Template.header.rendered = function() {
$('.bxslider').bxSlider({
    auto: true,
    autoControls: true,
    adaptiveHeight: true,
    responsive: true,
    infiniteLoop: true,
    pager: true,
    mode: 'fade'
});