防止Observable再次运行直到完成

Question

在使用observables的Angular4/Ionic3环境中。滑块在页面上的幻灯片。当一个人滑动移动到下一张幻灯片时，会发射一个多步骤，长时间运行的观测值。目前，当一个人再次滑动第二个可观察实例时（在第一个实例完成之前）。

我该如何使第一个可观察物等待第二个可观察物完成？我不想阻止该人滑动。滑动事件应该简单地排列下一个可观察对象。

当前时间轴

1. Swipe1
2. 可观察的Instance1 =开始
3. Swipe2
4. 可观察实例2 =开始
5. 可观察的Instance1 =端
6. 可观察实例2 =端

希望的时间轴

1. Swipe1
2. 可观察的Instance1 =开始
3. 可观察的Instance1 =端
4. Swipe2
5. 可观察实例2 =开始
6. 可观察实例2 =端

当前可观察伪码

private slideNextStart(event) { 

    // Don't let this Observable be called again until it finishes. 
    Observable.of(null) 
    .flatMap(() => { 
     console.log('start'); 
     // Do something. 
    }) 
    .flatMap(() => { 
     // Do something else. 
    }) 
    .flatMap(() => { 
     // Do another something else. 
    }) 
    .subscribe(() => { console.log('end'); }); 

Angular2转换的代码从Julia的回答

import { Observable } from 'rxjs/Rx'; 
import { Subject } from 'rxjs/Subject'; 

let subject = new Subject(); 
subject.asObservable() 
    .concatMap((x: Observable<any>) => { return x }) 
    .subscribe(x => console.log(x)); 

// request 1 
subject.next(Observable 
    .timer(4000) 
    .map(() => { console.log('req1') }) 
    .mapTo('req1')); 

// request 2 
subject.next(Observable.of('req2')); 

Answer 1

Observable.concatMap是专为这一点。 “将每个源值投影到在输出Observable中合并的Observable，并以序列化的方式等待每个源合并到下一个。”concatMap

// subject to emit observables 
let subject = new Rx.Subject(); 

// do concatMap to sequence the requests 
subject.asObservable() 
.concatMap(x=>x) 
.subscribe(x=>console.log(x)) 

// request 1 
subject.next(Rx.Observable 
    .timer(4000) 
    .mapTo('req1')); 

// request 2 
subject.next(Rx.Observable.of('req2'));