离子滑动循环后的白色空间

Question

我正在构建一个小型移动应用，并且已经考虑使用ionSlides（基于Swiper小部件）实现滑动按钮栏。这个想法是在这个栏上有一些用户可以循环/循环的项目。

我当前实现的问题是在第一个循环结束后/下一个循环之前有一些空白区域。在DOM中，没有空白＆＃39;正在生成的元素。有一个self.value = map["value"] 类的div，它会在用户幻灯片时更新它的变换样式 - 它接近列表末尾的-500px，并在滑过白色后点击返回0空间。

是否有修复，或者是否有任何我可以尝试应用于这些选项的属性，或者之前是否有其他人看过此问题？

一些代码：

swiper-wrapper

index.html

<ion-slides options="options" slider="data.slider"> <ion-slide-page ng-repeat="slide in slides" class="circle white-bg"> <h2>{{slide}}</h2> </ion-slide-page> </ion-slides>

app.js

一些图片：

1. 滑块的开始
2. 接近幻灯片列表的末尾
3. ＆＃39;填充物的例子＆＃39;白色空间 一旦幻灯片＃1滑出视图，框就会返回到正常状态，并且与图片＃1的行为类似。

Answer 1

对于可能遇到此问题的其他人：

我从$ scope.options中删除了width属性，而是使用了slidePerView。没有任何空格的循环！

$scope.options = {
  loop: true,
  effect: 'slide',

  freeMode: true,
  freeModeSticky: false,

  slidesPerView: 6,
  spaceBetween: 25
}

Answer 2

试试这个：

    $scope.options = {
      loop: true,
      effect: 'slide',

      freeMode: true,
      freeModeSticky: false,

      slidesPerView: 'auto',
      spaceBetween: 25
    }

CSS：

.swiper-slide {
  width: 55px;
}