I'm trying to create a slider component inside a page in an ionic 2 app. I've gotten it to work as intended with the exception that the pager dots don't show up. The documentation on how to use the pager isn't great. Any ideas where I'm going wrong here?
<div class="slider-container">
<ion-slides pager="true">
<ion-slide>
<div class="slide">
<img src='assets/image/scoping.png' />
<p class="slide-title">TITLE 1</p>
<p class="slide-text">Body text 1</p>
</div>
</ion-slide>
<ion-slide>
<div class="slide">
<img src='assets/image/projectmgmt.png' />
<p class="slide-title">TITLE 2</p>
<p class="slide-text">Body text 2</p>
</div>
</ion-slide>
<ion-slide>
<div class="slide">
<img src='assets/image/satisfaction.png' />
<p class="slide-title">TITLE 3</p>
<p class="slide-text">Body text 3</p>
</div>
</ion-slide>
</ion-slides>
</div>
I have also tried <ion-slides options="{pagination: true}"> and <ion-slides pager="true"> and neither of these have worked.
Edited: Upon inspection in the browser, I'm seeing the pager being rendered with a div container like this:
<div class="swiper-pager hide">
So I'm definitely not using the right parameters to unhide the pager. Or there's a bug. I'm using Ionic v2.0.0.
Finally got it to work with this as the opening tag of the slides:
<ion-slides [options]="{pagination: true}">