如何使用Skip和Take与RxJs Observable

Question

我正在学习Angular 2,TypeScript,RxJ等等.我在使用RxJs和Observable在服务中返回数据子集时遇到了问题.

我希望下面的getCars函数读取一个json文件,解析它并返回一个数据片段(偏移和计数).但是,我总是得到所有数据(我在测试的文件中有200个实体/汽车).

我究竟做错了什么？

EntityService

@Injectable()
export class EntityService {

  constructor(private http: Http) { }

  getCars(offset: number, count: number): Observable<Car[]> {
     return this.http
      .get('resources/data/cars.json')   
      .map(this.extractData)
      .skip(offset)
      .take(count)
      .catch(this.handleError);
  }

  private extractData(res: Response) {
    let body = res.json();
    return body.data || {};
  }

  private handleError(error: any) {
    // ...
  }
}

cars.json

    {
        "data":[
            {
                "vin":"ee8a89d8",
                "brand":"Fiat",
                "year":1987,
                "color":"Maroon"
            },
            {
                "vin":"642b3edc",
                "brand":"Renault",
                "year":1968,
                "color":"White"
            }
    ]
}

Answer 1

实际上,您将始终使用此加载所有数据.仅当您在数据流中收到多个事件时,skip和take运算符才适用:

• skip:跳过一些事件
• take:仅考虑指定数量的事件

在您的情况下(HTTP请求),您只有一个:获取数据时.因此,如果要过滤数据,则需要使用其他map运算符.像这样的东西:

getCars(offset: number, count: number): Observable<Car[]> {
  return this.http
    .get('resources/data/cars.json')   
    .map(this.extractData)
    .map(data => {
      return data.slice(offset, offset + count); // <----
    })
    .catch(this.handleError);
}