Display the left and right arrow of a slider


Anyone knows how to display the left and right arrow of a slider?

I mean these:

Like in the example: http://idangero.us/swiper/demos/200-infinite-loop.html

I have added

navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',

but doesn’t seems to be enough


i do this by using position and two line code :wink::sweat_smile:

html file

  <div style="position: absolute;top: 50%;left: 16px;font-size: 25px;z-index: 2;" (click)="slidePrev()">
    <ion-icon name="arrow-back"></ion-icon>
  <div style="position: absolute;top: 50%;right: 16px;font-size: 25px;z-index: 2;" (click)="slideNext()">
    <ion-icon name="arrow-forward"></ion-icon>
  <ion-slides paginationType="bullets" slidesPerView="1" pager="true">
      <h1>Slide 1</h1>
      <h1>Slide 2</h1>
      <h1>Slide 3</h1>

ts file

  @ViewChild(Slides) slides: Slides;
  slidePrev() {
  slideNext() {


Hahaha you know what? Seeing your answer where you say “i do this by…” reminds me … I do it too already in my app :smile:

I’m trying to add these arrows in another kind of project

Thx for the quick feedback