1

Angular 和 RxJS 的新手，试图理解这一点......我的应用程序对 UI 事件做出反应，并导致调用返回 Observable 的 HTTP 服务。我像这样订阅它：

this.myXYZService.search(query)
  .map(r => { // some code })
  .subscribe(r => { //some code });

假设该事件再次触发，它会导致对同一个 HTTP 服务进行第二次调用，该服务将在第一次调用完成之前返回一个全新的 Observable。

现在，据我了解，我可以使用 switchMap 而不是 map 来丢弃旧的 Observable 并对新的 Observable 进行操作？还是我理解错误？如果在第一个事件已经在链的订阅部分之后触发第二个事件会发生什么？在这种情况下它会不再切换？而且由于 JS 是同步的，在第二个事件甚至开始处理它的链之前，整个第一个链不会执行吗？

我想我对整个事情感到困惑，因为 Observables 的实例不同 - Rx 如何跟踪哪个调用来切换？是函数名吗？假设我有 2 个单独的代码块：

this.myXYZService.search('abcd')
  .map(r => { // some code })
  .subscribe(r => { //some code });

this.myXYZService.search('efgh')
  .map(r => { // some code })
  .subscribe(r => { //some code });

如果我在上面两个上都使用 switchMap 到底会发生什么？第二个电话会抵消第一个电话吗？

4

2 回答 2

10

当外部 observable 发出时，switchMap 取消之前的内部 observable。例如

Observable.fromEvent(inputEl, 'keydown') // outer observable
    .switchMap(event => {
        let value = event.value;

        return this.myXYZService.search(value); // inner observable
    })
    .subscribe(res => {
        // some code
    });

在这种情况下，每次外部 observable (fromEvent) 发出（在输入元素的 keydown 时），都会调用内部 observable (myXYZService.search) 并取消之前的内部 observable。

于 2017-12-05T19:31:36.327 回答
3

你会想要类似...

searchTerms.switchMap( searchTerm => this.myXYZService.search(searchTerm) ).subscribe(...)

一旦新的搜索词到达，任何正在进行的搜索调用都将被忽略/丢弃。我不会使用取消这个词，因为电话仍然打断。但是，他们的结果将被忽略。

如果第一个请求在发出第二个搜索词之前返回，那么它将被发送到订阅。如果没有，那么它不会。

于 2017-12-05T19:31:55.197 回答