Quantcast
Channel: Ionic Forum - Latest posts
Viewing all articles
Browse latest Browse all 230202

Ion-slides loop property doesn't work with ngFor

$
0
0

Hello @Taraa,
Please try below code. I tested on Ionic 5 it works. You can use h1 or img and make some style changes.

TS Code

slides = [
    { name: "Slide 1", imgUrl: "https://aws1.discourse-cdn.com/ionicframework/original/3X/9/4/94850a46742204751c28bbe6d78168d7e870ce80.png" },
    { name: "Slide 2", imgUrl: "https://aws1.discourse-cdn.com/ionicframework/original/3X/9/4/94850a46742204751c28bbe6d78168d7e870ce80.png" },
    { name: "Slide 3", imgUrl: "https://aws1.discourse-cdn.com/ionicframework/original/3X/9/4/94850a46742204751c28bbe6d78168d7e870ce80.png" }
  ]
  slideOpts = {
    initialSlide: 1,
    speed: 400
  };

HTML Code:

<ion-slides pager="true" [options]="slideOpts">
        <ion-slide *ngFor="let slide of slides">
            <h1>{{slide.name}}</h1>
            <img src="{{slide.imgUrl}}" />
        </ion-slide>
    </ion-slides>

Viewing all articles
Browse latest Browse all 230202

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>