2017-06-04 5 views
0

Ich erstelle einen Schieberegler mit Bildern und Videos und möchte für jeden Typ eine bestimmte Bildschirmzeit zuweisen.Dynamischer Timer in rxjs

let data = [{"path":"http://localhost:8091/public/testimg.jpg","type":"image"},{"path":"http://localhost:8091/public/testvideo.mp4","type":"video"}] 
Observable.timer(0, 3000) 
          .map(e => { 
           console.log(e); return data[e % data.length]; 
          }) 
          .subscribe(item => { 
           this.activeItem = item; 
          }); 

Ich bin in der Lage eine allgemeine Zeit für alle Folien, um den obigen Code verwenden, aber bin nicht in der Lage separate Werte für jedes der Elemente im Array tun eingestellt. Hier

ist, was ich will eigentlich 1) eine Iteration durch das Array von 0 bis zum letzten Index erreichen, sobald es abgeschlossen ist Iterieren unendlich 2) Um eine Zeit zu setzen, wenn die nächste Iteration stattfindet, auf der Grundlage des Geben Sie die Eigenschaft in jedes Objekt ein.

Gerade jetzt nur 1) ist erfüllbar.

Antwort

1

Der Trick wäre, concatMap zu verwenden. Es wird von jedem Gegenstand eine unmittelbare Beobachtung mit dem Gegenstand gefolgt von einer Verzögerung eines leeren Beobachtbaren erzeugen. Nach dieser Verzögerung ist das Beobachtbare abgeschlossen, und das nächste wird verkettet. Dies wird mit dem repeat() -Operator unendlich wiederholt.

let data = [{"path":"http://localhost:8091/public/testimg.jpg","type":"image"},{"path":"http://localhost:8091/public/testvideo.mp4","type":"video"}]; 

const delayByMediaType = {image: 1000, video: 5000}; 

Observable.from(data) 
    .concatMap(media => 
     Observable.of(media).concat(Observable.empty().delay(delayByMediaType[media.type])) 
    ) 
    .repeat() 
    .do(console.log) 
    .subscribe(item => this.activeItem = item); 
+0

Danke, folgte ich einen ähnlichen Ansatz mit etwas Hilfe von der gitter Seite. – Bazinga777

0
let data = [{"path":"http://localhost:8091/public/testimg.jpg","type":"image"},{ "path":"http://localhost:8091/public/testvideo.mp4","type":"video"}]; 

const delayByMediaType = {image: 1000, video: 5000}; 

Observable.from(data) 
.concatMap(media => { 
    return Observable.of(media).delay(delayByMediaType[media.type]) 
}).subscribe(console.log);