ajax - 当另一个 Observable 发出它的第一个值时启动流

Question

我有两个可观察对象，一个来自按键事件，另一个来自 ajax 请求。我希望第二个流在第一个流发出第一个值时开始。

var input$ = Rx.Observable.fromEvent( input, 'keydown')
                          .debounceTime(500)


var countries$ = Rx.Observable.of('https://restcountries.eu/rest/v1/all')
                   .flatMap(url => $.get( url ))
                   .retryWhen( errors => {
                        return errors.scan( (sum, err) => {
                          if( sum === 2 )
                          {
                            throw err;
                          }
                          else{
                            return sum + 1;
                          }
                        }, 0).delay(1000)
                    })

我正在使用 rxjs 5，我希望 countries$ observable 在 input$ observable 发出它的第一个值时启动。我尝试使用 skipUntil 或 debounce 传递 input$ Observable 但是......没有运气。在我开始输入任何内容之前，我看到网络选项卡中发生了 ajax 请求。 知道如何实现我想要的吗？

Answer 1

使用switchMap .每当源 Observable 发出时，这将从源流切换到新流

var url = 'https://restcountries.eu/rest/v1/all';

var countries$ = input$.switchMap(input => $.get(url))
                       .retryWhen(...

请注意，如果在 http 请求完成之前有新的输入到达，旧的请求将被取消并发出新的请求。所以 switchMap 如果发出的 http 请求取决于特定输入(如在搜索查询中)，那么 switchMap 是完美的

我使用了静态 URL，因为这是您的 OP 使用的，但您可以轻松地更改 URL 以包含根据输入构建的查询参数。

如果您希望无论输入是什么都只运行一次 http 请求，并且不想在新输入到达时取消旧请求，请使用 take 仅从源读取一次:

var countries$ = input$.take(1).switchMap(input => $.get(url))
                       .retryWhen(...