Ionic slides (swiper) and ng-repeat: how to get it to work?


Well, I have a problem. The autoplay option is not working in my slider, that fetches the images I put in the ng-repeat. So the images are all fetched and that works, yet it does not recognize it properly (I guess?) to make autoplay working. I am using Ionic v1 btw.

Cordova CLI: 6.4.0 
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
ios-deploy version: 1.9.0 
ios-sim version: 5.0.8 
OS: macOS Sierra
Node Version: v6.8.1
Xcode version: Xcode 8.3.2 Build version 8E2002

This is what I have in my controller:

 // Start slider

  $scope.options = {
    autoplay: 1500

  $scope.$on("$ionicSlides.sliderInitialized", function (event, data) {
    // data.slider is the instance of Swiper
    $scope.slider = data.slider;

  // Slider end

And this it the HTML:

<ion-slides options="options" slider="slider">
      <ion-slide-page ng-repeat="user in users | filter:{userFilter: true}">
        <img ng-src="{{user.leadImage}}">

Whatever I do, the autoplay does not work!

When I try the same options and the same HTML, without the ng-repeat, the autoplay suddenly works!

So what am I doing wrong here?


Try this solution…it is working for me

    <ion-slide-box style="padding-top:20px;" show-pager="false" auto-play="true" does-continue="true">

                       <ion-slide ng-repeat="user in users | filter:{userFilter: true}">
                            <div class="card-img">
                             <input type="image" src="{{user.leadImage}}" />


This one is not compatible with mine. I don’t use the slide-box either, so thanks, but no thanks.

I need a solution for my version…


which version…version 2???

upper answer is for version 1


I am not using ion-slide-box. Please check my HTML first. It’s using Swiper.

When I remove ng-repeat, all options work. When ng-repeat is there, AUTOPLAY does not work. That is the issue.

I don’t want to use ion-slide-box.

And no: I am using version 1.