1

我对 rxjs 函数有一些疑问。实际上，我向 http 服务器发出请求。我从 http 服务器接收数据的方式是两个步骤，因为每个请求只返回 10 个项目，而不是整个项目。每个请求都有页码，所以如果我总共有 100 个项目，我必须进行 10 次请求。因此，在逐个发出请求之前，我先提取总页数，然后循环请求与页数一样多的请求。为了做到这一点，我使用如下 switchMap 函数。

getItems(id: string) {
    return this.dataService.getPageNum(id).switchMap (
    (page_num: number) => { 

                for(let i=1; i<=page_num; i++) {
                    this.dataService.getItems(id, i).subscribe(
                        (data: Object) => {
                            this.items.push(data); 
                        }
                    )
                }
            }
        );
    }

它返回错误错误 TS2345：'(page_num: number) => void' 类型的参数不可分配给'(value: number, index: number) => ObservableInput<{}>' 类型的参数。类型 'void' 不可分配给类型 'ObservableInput<{}>'。

所以，我搜索了一些关于这个问题的信息，我发现了一些东西，

Angular 2 - RxJS 切换映射问题

但我不明白什么问题和答案说得好。这意味着我应该把 Observable.empty() 让它工作？此外，我什至尝试返回 Observable.of(null) 和 Observable.empty()，它说即使我导入了该函数，类型“typeof Observable”上也不存在属性“empty”。

4

1 回答 1

2

我很高兴你熟悉 rxjs。你有几个错误。

活生生的例子

  1. 您在 switchMap 函数中没有返回任何内容。它期望你这样做（返回一个 observable），这就是 mergeMap、switchMap 和 concatMap 的目的，以平整地图。查看此站点，希望它可以帮助您入门。

  2. 您必须从平面地图管理订阅，而不是在 switchMap 函数内部。所以这条线是不正确的：

this.dataService.getItems(id, i).subscribe(

你的.component.ts

 getItems(id: string) {
           return this.dataService.getPageNum(id)
                     .switchMap((page_num: number) => {
                         for(let i=1; i<=page_num; i++) {
                             return this.dataService.getItems(id, i);
                         }
                     }).subscribe((data: Object) => {
                         this.items.push(data); 
                     });
         }
  1. 最后，由于rxjs 核心团队的建议是使用管道运算符，这是正确的解决方案，我的意思是 rxjs 方式：

import { switchMap } from 'rxjs/operators';

...

getItems(id: string) {
      return this.dataService.getPageNum(id)
                .pipe(switchMap((page_num: number) => {
                    for(let i=1; i<=page_num; i++) {
                        return this.dataService.getItems(id, i);
                    }
                })).subscribe((data: Object) => {
                    this.items.push(data); 
                });
    }
于 2018-03-07T19:36:20.087 回答