Why the pagination bullet will not display in the screen?

Ionic Framework ionic-v3
1

May I know why the pagination bullet always not display in the slides? Any problem with my code?

Below is my code:

<ion-scroll scrollY="true">
    <ion-slides pager>
      <ion-slide>
        <img src="assets/img/test1.jpg" class="slide-image"/>
        <h3 class="slide-title">test1</h3>
        <p>testing 1 description</p>
        <ion-item text-left text-wrap>
          <ol type="1">
            <li>step 1</li>
            <li>step 2</li>
            <li>step 3</li>
          </ol>
        </ion-item>
      </ion-slide>

      <ion-slide>
        <img src="assets/img/test2.jpg" class="slide-image"/>
        <h3 class="slide-title">test2</h3>
        <p>descr 1</p>
      </ion-slide>

      <ion-slide>
        <img src="assets/img/test3.jpg" class="slide-image"/>
        <h3 class="slide-title">test3</h3>
        <p>descr 3</p>
      </ion-slide>
    </ion-slides>
  </ion-scroll>

The pagination bullet does not display in the screen

image
image617×755 17.1 KB

2

You need to provide slide options through the options property now, i.e do this:

<ion-slides [options]="slideOptions">

and then in your .ts file (above the constructor):

  slideOptions: any = {
    pager: true
  };
1 Like