Angular 2 - RxJS 切换映射问题

Question

我想在我的应用程序中有一个无限滚动部分。为此，我使用 this component处理滚动事件等。当滚动到达 div 的底部时，我正在调用一个函数来获取更多数据。到目前为止一切顺利。

为了使这个函数更有效率，我尝试在调用之前等待几秒钟，并确保数据得到正确处理。为此，我一直在查看 Angular website that showcases a wikipedia search 上显示的示例.

我的设置与文章中显示的设置类似，我的问题是调用 switchMap() 时出现以下错误:

Type 'void' is not assignable to type 'ObservableInput<{}>'

这是我的代码示例:

private scrollEndActive: Subject<boolean> = new Subject<boolean>();

ngOnInit() {
    ...
    this.scrollEndActive
        .debounceTime(1000)
        .distinctUntilChanged()
        .switchMap(data => {
            // ... get data from server
        })
}

...

// event to trigger call to server
scrollEnd() {
    this.scrollEndActive.next(true);
}

使用上面的代码，这就是我得到的:

根据我所做的研究，这似乎是一个与应该返回 Observable ( Type 'void' is not assignable to type 'ObservableInput<{}>') 这一事实相关的问题。但就我而言，我不确定是什么问题。

我正在与:

• Angular 4.0.1
• typescript 2.2.2
• RxJS 5.2.0

Answer 1

默认情况下，箭头函数 () => {...} 的返回类型为 void 除非你返回一些东西。

如果你想使用switchMap不返回任何东西，你可以按照yurzui在评论中说的那样，return Observable.empty()。

话虽这么说，如果你在你的switchMap中返回一个空的observable，这意味着你不需要switchMap，你可以直接使用do 运算符，在不修改返回数据的情况下执行操作。或者 mergeMap，它允许您从从原始数据中获得的数据返回一个新的 Observable。