Question

我使用rxjs并且我的问题是，如果我想在observable完成时调用next函数，有什么办法吗？所以不要这样：

this.Start(data).subscribe(
    (data) => {
        console.log('next');
    },
    (err) => {
        console.log('err');
    },
    () => {
        console.log('complete');

        this.nextFunction()   // this return with other observable
        .subscribe(
            (data) => {
                console.log('next');
            },
            (err) => {
                console.log('err');
            },
            () => {
                console.log('complete');
                this.nextFunction2(); // this returns with other observable
                .subscribe(
                    (data) => {
                        console.log('next');
                    },
                    (err) => {
                        console.log('err');
                    },
                    () => {
                        console.log('complete');
                        this.nextFunction3()
                        .subscribe(...)
                    }
                );
            }
        );
    }
);

类似的东西：

this.Start(data).subscribe(
    (data) => {
        console.log('next');
    },
    (err) => {
        console.log('err');
    },
    () => {
        console.log('complete');
        return other observable;
    }
)
.then(
    (data) => {
        console.log('next');
    },
    (err) => {
        console.log('err');
    },
    () => {
        console.log('complete');
        return other observable;
    }
)
.then(
    (data) => {
        console.log('next');
    },
    (err) => {
        console.log('err');
    },
    () => {
        console.log('complete');
        return other observable;
    }
);

所以我不想像金字塔一样设计我的代码。

Answer 1

您可以使用静态concat运算符来构成一个接一个地订阅observable的observable：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/concat';
import 'rxjs/add/observable/defer';

Observable.concat(
  this.Start(data),
  Observable.defer(() => this.nextFunction()),
  Observable.defer(() => this.nextFunction2()),
  Observable.defer(() => this.nextFunction3()),
)
.subscribe();

请注意，defer运算符用于推迟获取子队列可观察量的调用。

将一些日志记录组成：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/concat';
import 'rxjs/add/observable/defer';
import 'rxjs/add/operator/do';

Observable.concat(
  this.Start(data).do(
    (value) => { console.log("next: Start:", value); },
    (error) => { console.log("error: Start:", error); },
    () => { console.log("completed: Start"); }
  ),
  Observable.defer(() => this.nextFunction().do(
    (value) => { console.log("next: nextFunction:", value); },
    (error) => { console.log("error: nextFunction:", error); },
    () => { console.log("completed: nextFunction"); }
  )),
  Observable.defer(() => this.nextFunction2().do(
    (value) => { console.log("next: nextFunction2:", value); },
    (error) => { console.log("error: nextFunction2:", error); },
    () => { console.log("completed: nextFunction2"); }
  )),
  Observable.defer(() => this.nextFunction3().do(
    (value) => { console.log("next: nextFunction3:", value); },
    (error) => { console.log("error: nextFunction3:", error); },
    () => { console.log("completed: nextFunction3"); }
  )),
)
.subscribe();

只有当它完成时，才能通过链接多个observable来防止金字塔

1 个答案: