每个可观察值仅调用一次 RxJS 平面地图函数答案

【问题标题】：Call RxJS flat map function only once per observable value每个可观察值仅调用一次 RxJS 平面地图函数
【发布时间】：2016-10-13 19:06:22
【问题描述】：

我在处理一些输入、启动 Ajax 请求并处理该请求的结果的简单 RxJS 流时遇到问题。

重现问题的简单示例：

var requestCalled = 0;

function fakeRequest(value) {
  return new Promise(function(resolve) {
    requestCalled++;
    document.write("<p>"+requestCalled+" ("+value+")</p>");
  });
}

var stream = Rx.Observable.interval(3000)
  .debounce(500)
  .distinctUntilChanged()
  .flatMapLatest(fakeRequest);

stream.subscribe(() => {});
stream.subscribe(() => {});

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.min.js"&gt;&lt;/script&gt;

结果（每个可观察值调用 fakeRequest 两次）

1 (0)
2 (0)
3 (1)
4 (1)

预期结果（只调用一次fakeRequest）

1 (0)
2 (1)

所以我希望该函数 fakeRequest 在该 RxJS Observable 中的每个值仅被调用一次。但是当我添加多个订阅者时，每个订阅者都会启动请求。

是否有另一种方法可以替换flatMapLatest，以便每个 Observable 值只启动一个请求？

【问题讨论】：

标签： rxjs

【解决方案1】：

你可以试试.share

var requestCalled = 0;

function fakeRequest(value) {
  return new Promise(function(resolve) {
    requestCalled++;
    document.write("<p>"+requestCalled+" ("+value+")</p>");
  });
}

var stream = Rx.Observable.interval(3000)
  .debounce(500)
  .distinctUntilChanged()
  .flatMapLatest(fakeRequest)
  .share();

stream.subscribe(() => {});
stream.subscribe(() => {});

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.min.js"&gt;&lt;/script&gt;

【讨论】：

啊，太好了，而且有效。谢谢！很快就会接受答复。