在折叠选项卡中加载时，Slick 轮播的宽度为 0px

当在折叠内容中加载光滑滑块时（在本例中为 Angular-bootstrap 折叠插件），.slick-track div 的宽度为 0px，导致滑块尝试将所有幻灯片叠放在一起。当按箭头查看下一张幻灯片时，幻灯片将恢复正常。如果我选择滑块并想要检查浏览器中的组件，它也会恢复正常。

请看这个例子：http://plnkr.co/edit/iw9f2alEnK0HFkv1eq16?p=preview

这是我正在使用的灵活配置：

$(document).ready(function(){
    $('.tourImageSlider').slick({
          dots: true,
          infinite: false,
          slidesToShow: 3,
          slidesToScroll: 1,
          responsive: [
            {
              breakpoint: 1500,
              settings: {
                slidesToShow: 2,
                slidesToScroll: 1,
              }
            },
            {
              breakpoint: 1000,
              settings: {
                slidesToShow: 1,
                slidesToScroll: 1,
              }
            }]
    });
});

有人知道如何解决这个问题吗？

最终我得到了狡猾的创作者 Ken Wheeler 本人的答案。当可折叠内容被触发打开时，只需调用以下行：

$('.slider-class').slick('setPosition');

...并将“slider-class”替换为滑块的类名称。 我个人用这条线创建了一个角度函数，并用 ng-open 触发它。