2016-07-14 8 views
1

ギャラリービューを構築するときにion-slidesを実装しました。しかし、私は、アプリケーションをion-serve -lときに私が気づいたことの一つは、が唯一のiOSが最初のスライドが続きますが、WindowsとAndroidは常に最初に...ここに私のコードがあるIonic2のイオンスライドで機能不良が発生する

home.html

<ion-content class="slide"> 
    <ion-slides [options]="slideOptions"> 
     <ion-slide *ngFor="let element of list"> 
      <img src="{{element.image_path}}"/> 
     </ion-slide> 
    </ion-slides> 
</ion-content> 
から始まったということでした

home.ts

import {Component} from '@angular/core'; 
import {NavController, NavParams, Slides} from 'ionic-angular'; 

@Component({ 
    templateUrl: 'build/pages/home/home.html' 
}) 

export class HomePage { 
    slideOptions; 
    list; 

    constructor(private nav: NavController, private params: NavParams) { 
      this.slideOptions = { 
       initialSlide: 5, 
       pager: true 
      }; 
     // Assume that the data is from the variable list I give values to here 
    } 
} 

誰も助けることができますか?

答えて

0

最新のバージョンで動作するコードは、最新のIonicバージョンを使用していることを前提としています。

あなたは以下のようにhome.tsを変更する必要があります。また、あなたがリストの配列を移入する必要が

<ion-content > 
<ion-slides pager> 
    <ion-slide *ngFor="let element of list"> 
     <img src="{{element.image_path}}"/> 
    </ion-slide> 
</ion-slides> 

を:

import {Component} from '@angular/core'; 
import {NavController, NavParams, Slides} from 'ionic-angular'; 

@Component({ 
    templateUrl: 'build/pages/home/home.html' 
}) 

export class HomePage { 
@ViewChild(Slides) slides: Slides; 

list; 

constructor(private nav: NavController, private params: NavParams) { 

} 

ionViewDidEnter(){ 
    this.slides.slideTo(5); 
} 
} 

と以下のようにhome.htmlを変更。

関連する問題