如何获取离子载玻片的实例

Question

我正在使用 Ionic 2 ion-slides，并想在其上调用一些实例方法。我有以下标记：

<ion-content padding>
  <ion-slides (ionDidChange)="onSlideChanged($event)" id="loopSlider">
   <ion-slide *ngFor="let slide of slides">
    <h1>{{ slide.title }}</h1>
  </ion-slide>
</ion-slides>
</ion-content>

我尝试使用在（可能已过时的）示例中找到的以下代码：

 private gotoSlide(index: number): void {
   this.sliderComponent = this.app.getComponent('loopSlider');
   this.sliderComponent.slider.slideTo(index);
  }

但 this.app.getComponent('loopSlider'); 总是 returns null.

有谁知道如何获取组件实例以便我可以使用它API？

Answer 1

根据 the Ionic documentation, you can do this using @ViewChild:

import { Component, ViewChild } from '@angular/core';
import { Slides } from 'ionic-angular';
...

@Component({
  ...
})
class MyPage {
  @ViewChild('loopSlider') sliderComponent: Slides;

  ...
}

Answer 2

现在 Ionic4 已经推出一段时间了，为此更新这样的答案可能很省钱。

import { IonSlides } from '@ionic/angular';

export class...
@ViewChild(IonSlides) productSlider: IonSlides;

如何获取离子载玻片的实例

How to get the instance of a ion-slides

ionic2

angular