How to get Swiper instance from getSwiper in Ionic5 and Angular

Question

I am using ion-slides in my Ionic 5 project in Angular. As per this document I want to get the instance of the Swiper by method getSwiper to use Zoom Methods & Properties

Following is the HTML code:

<ion-slides [options]="slideOpts" zoom>
  <ion-slide>
    <div class="swiper-zoom-container">
      <img [src]=myURL />
    </div>
  </ion-slide>
</ion-slides>

I am not able to call the method getSwiper in the class. I don't know how to call it. Do I need to use ViewChild for ion-slides or any IonSlide event can get the instance?

Answer 1

Something like this

import { Component, OnInit, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
import { IonSlides } from '@ionic/angular';

@Component({
  selector: 'app-demo',
  templateUrl: './demo.component.html',
  styleUrls: ['./demo.component.scss'],
})
export class DemoComponent implements OnInit, AfterViewInit {
  @ViewChild(IonSlides) slides: any;
  constructor() { }

  ngOnInit() {}

  async ngAfterViewInit() {
    console.log(await this.slides.getSwiper())
  }

}