RxJS中的链接可观察量 [英] Chaining Observables in RxJS

查看:152
本文介绍了RxJS中的链接可观察量的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在学习RxJS和Angular 2.假设我有一个带有多个异步函数调用的promise链,它取决于前一个的结果,如下所示:

I'm learning RxJS and Angular 2. Let's say I have a promise chain with multiple async function calls which depend on the previous one's result which looks like:

var promiseChain = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(1);
  }, 1000);
}).then((result) => {
  console.log(result);

  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(result + 2);
    }, 1000);
  });
}).then((result) => {
  console.log(result);

  return new Promise((resolve, reject) => {
      setTimeout(() => {
      resolve(result + 3);
        }, 1000);
  });
});

promiseChain.then((finalResult) => {
  console.log(finalResult);
});

我尝试单独使用RxJS而不使用promises产生以下内容:

My attempts at doing the same solely using RxJS without the use of promises produced the following:

var observableChain = Observable.create((observer) => {
  setTimeout(() => {
    observer.next(1);
    observer.complete();
  }, 1000);
}).flatMap((result) => {
  console.log(result);

  return Observable.create((observer) => {
    setTimeout(() => {
      observer.next(result + 2);
      observer.complete()
    }, 1000);
  });
}).flatMap((result) => {
  console.log(result);

  return Observable.create((observer) => {
    setTimeout(() => {
      observer.next(result + 3);
      observer.complete()
    }, 1000);
  });
});

observableChain.subscribe((finalResult) => {
  console.log(finalResult);
});

它产生与promise链相同的输出。我的问题是

It yields the same output as the promise chain. My questions are


  1. 我这样做了吗?我是否可以对上述代码进行任何与RxJS相关的改进

  1. Am I doing this right? Are there any RxJS related improvements that I can make to the above code

如何重复执行此可观察链?即在最后添加另一个订阅只会产生额外的6,虽然我希望它打印1,3和6。

How do I get this observable chain to execute repeatedly? i.e. Adding another subscription at the end just produces an additional 6 though I expect it to print 1, 3 and 6.

observableChain.subscribe((finalResult)=> {
console.log(finalResult);
});

observableChain.subscribe((finalResult) => { console.log(finalResult); });

observableChain.subscribe((finalResult)=> {
console.log( finalResult);
});

observableChain.subscribe((finalResult) => { console.log(finalResult); });

1
3
6
6

1 3 6 6


推荐答案

关于承诺组合与Rxjs,因为这是一个经常被问到的问题,你可以参考一些之前有关SO的问题,其中包括:

About promise composition vs. Rxjs, as this is a frequently asked question, you can refer to a number of previously asked questions on SO, among which :

  • How to do the chain sequence in rxjs
  • RxJS Promise Composition (passing data)
  • RxJS sequence equvalent to promise.then()?

基本上, flatMap 相当于 Promise.then

对于第二个问题,是否要重播已经发出的值,或者是否要在到达时处理新值?在第一种情况下,请检查 publishReplay 运算符。在第二种情况下,标准订阅就足够了。但是你可能需要注意感冒。与热二分法相比,取决于你的来源(参见热门和Cold Observables:有热和冷运算符吗?对概念的说明性解释)

For your second question, do you want to replay values already emitted, or do you want to process new values as they arrive? In the first case, check the publishReplay operator. In the second case, standard subscription is enough. However you might need to be aware of the cold. vs. hot dichotomy depending on your source (cf. Hot and Cold observables : are there 'hot' and 'cold' operators? for an illustrated explanation of the concept)

这篇关于RxJS中的链接可观察量的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆