2017-05-10 10 views
0

は私が私のスライドに設定する項目の配列を*ngForを使用して正常に動作していないthis.slides.slideNext():これはイオン2から

<ion-slides #exercisesSlider (ionSlideDidChange)="slideChanged()" pager> 
    <ion-slide *ngFor="let ex of allExercises; let i = index" id="{{ ex.exercise }}" 
     <ion-grid> 
      <ion-row> 
       <ion-col col-12> 
        <div (click)="playVid(ex.exercise)" padding-bottom> 
         <img [src]="ex.path" /> 
        </div> 
        <div text-center> 
        <!-- can't go back if it's the first exercise --> 
        <button *ngIf="i > 0" ion-button round (click)="previousExercise()">Vorige</button> 
        <!-- will not have a next exercise if it's the last one --> 
        <button *ngIf="i < 4" ion-button round (click)="nextExercise(i, ex.exercise, ex.done)">Voltooi</button> 

        </div> 
       </ion-col> 
       </ion-row> 
      </ion-grid> 
     </ion-slide> 
</ion-slides> 

ですが、私のnextExercise()

nextExercise(i, id, done) {  
     localForage.getItem("data").then((exDone) => { 
      console.log("dataArrayGetItem: ", exDone); 
      this.testArray.push(exDone); 
      console.log('testArray: ',this.testArray); 

      if(this.testArray){ 
       for(let i = 0; i < this.testArray.length; i++){ 
        console.log('forLoop testArray:', this.testArray[i][i]); 
        console.log(this.testArray[i][i].exercise,this.testArray[i][i].done, 'done'); 
        if(this.testArray[i][i].done){ 
         console.log('DONEEEE!!!'); 
         this.slides.slideNext(); 
        } 

        if(this.testArray[i].done && this.testArray[i].exercise == this.allExercises[i].done){ 
         console.log('DONEEEE!!!'); 
         this.slides.slideNext(); 
        } 
       } 
      } 
     });   

     let results = this.allExercises[i]; 
     this.dataArray.push(results);   
     console.log('this.dataArrayPush: ',this.dataArray); 
    } 

そして、ここではionWillLeaveメソッドで私はlocalStorageアイテムを設定しました:

ionViewWillLeave(){ 
     localForage.setItem("data", this.dataArray).then((exResults) => { 
      console.log("dataArraySetItem: ", exResults); 
     }); 
    } 

すべてconsole.logは正しく表示されていますが、nextSlide()は正しく動作していません。

基本的に私はビューを離れるときに配列を設定し、その配列にアクセスしてfor loopを作成し、次のエクササイズが完了したら次のスライドに移動する必要があります。 LINK

私が試してみました:最後の1が表示されないthis.slides.slideTo(3, 200, false);をしかし、私はこのコードを実行すると:

いくつかの追加情報については、これをチェックアウトすることができlet isLast = this.slides.isEnd(); // return true or false value console.log(isLast);をこれはtrueを返します。しかし、表示されていないので、どのようにしてthis.slides.slideNext()が次のスライドをif statementに表示するようにすることができますか?私はここでslideNext()this.slides.lockSwipes(true)this.slides.lockSwipes(false)を追加する必要がありました

答えて

0

getItem機能です:

localForage.getItem("data").then((exDone) => { 
      this.exercisesDoneArray.push(exDone); 

      if(this.exercisesDoneArray){ 
       for(let i = 0; i < this.exercisesDoneArray.length; i++){ 
        if(this.exercisesDoneArray[i][i].done && this.exercisesDoneArray[i][i].exercise == this.slides.clickedSlide.nextElementSibling.id){ 
         this.slides.lockSwipes(false); 
         this.slides.slideNext(); 
         this.slides.lockSwipes(true); 
        } 
       } 
      } 
     });