如何選擇離子2中的自動隨機滑塊？

我在離子2上工作。
我在一個數組列表中有很多滑塊，這是自動滑動。我需要從該列表中選擇隨機幻燈片，我該怎麼辦？如何選擇離子2中的自動隨機滑塊？

***************************************************** 
Your system information: 

Cordova CLI: 6.4.0 
Ionic CLI Version: 2.1.8 
Ionic App Lib Version: 2.1.4 
ios-deploy version: Not installed 
ios-sim version: 5.0.8 
OS: OS X Yosemite 
Node Version: v6.2.2 
Xcode version: Xcode 7.2 Build version 7C68 
******************************************************

代碼，我原樣 mypage.html--

<ion-slides #mySlider [options]="mySlideOptions"> 
    <ion-slide *ngFor="let quote of slides"> 
    <div class="myslider"> 
     <div class="quote-container" [innerHTML]="quote.title"></div> 
     <div [innerHTML]="quote.author" ></div> 
    </div> 
    </ion-slide> 
</ion-slides>

page.ts--

slides: Slide[]; 
this.slides = [ 
     {id: 1, author: "-Sanjay",  title: "my text goes here."}, 
     {id: 2, author: "-Sanjay",  title: "my text goes here"}, 
     {id: 3, author: "-Sanjay",  title: "my text goes here"}, 
     {id: 4, author: "-Sanjay",  title: "my text goes here"}]

的slider-

// quotes slider 
    mySlideOptions = { 
    initialSlide: 0, 
    loop: true, 
    effect: 'fade', 
    fade: {crossFade:true}, 
    autoplay:2700, 
    autoplayDisableOnInteraction: true, 
    direction:"horizontal", 
    speed:4000, 
    nextButton: ".pause-me", 
    prevButton: ".swiper-button-prev" 
    };

但不是Fonction隨機滑動，任何幫助？

來源

2016-12-07 S.Yadav

你的問題檢索是不明確的，你要顯示的圖像的隨機順序？ – Sakuto

是的，類似的東西，但所有的圖像必須在數組列表中。 –

下面的方法將自動滑動您的幻燈片，每當幻燈片發生變化時，新的（隨機）幻燈片即將到來。隨機方法使用你的slideslist的長度來計算一個隨機索引（在0和最大列表長度之間 - 1）。

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

class MyPage { 
    @ViewChild('mySlider') slider: Slides; 


    .... 

    getRandomIndex(): number { 
    // uses your list.length to get a random value within the range 
    return Math.floor(Math.random() * this.slides.length) 
    } 

    newSlide() { 
    this.slider.slideTo(this.getRandomIndex(),500) 
    } 
}

HTML

<ion-slides #mySlider (ionDidChange)="newSlide()" ........>

在這個答案的所有信息已經從the ionic docs

來源

2016-12-07 09:27:38 Ivaro18

謝謝@ivaro，它爲我工作。 –

如何選擇離子2中的自動隨機滑塊？

回答

相關問題