Question

在我看来，在swiper slide上使用ng-repeat会禁用在幻灯片中使用幻灯片的可能性。见JsFiddle link。它包含4个水平幻灯片，其中幻灯片2包含带有2个幻灯片的垂直幻灯片。它工作正常，但如果我改变HTML

<!-- This works:-->
<div class="swiper-slide">

要：

<!-- This works:-->
<div class="swiper-slide" ng-repeat=”let in letArr”>

然后我得到（如预期的）5个水平幻灯片，其中幻灯片2现在是两个幻灯片：幻灯片2a和2b。但我没有在幻灯片2a和2b上得到任何垂直幻灯片（我预期）。用于垂直滑动选择的分页子弹是可见的，但它们没有响应。这只是按照设计工作还是我错过了什么？

我可以在我的外部幻灯片库中手动扩展，但这会使维护变得困难并且错误。

Answer 1

90％的时间我的滑块不起作用，但是在那里或部分工作（就像构建分页按钮一样），一个简单的swiper.reInit（）可以工作。

使用angular，为了捕获在DOM中创建最后一张幻灯片的时间，我制作一个快速的swiperSlide指令并执行以下操作：

.directive('swiperSlide', function() {
    return function (scope, element, attrs) {
        if (scope.$last) setTimeout(function () {
            swiper.reInit(); //make sure you initialize your swiper to a variable called "swiper" or replace "swiper" with whatever your swiper variable is
        }, 1);
    };
});

在iDangerous swiper slide上使用ng-repeat

1 个答案: