typescript observable .expand用法

时间:2018-02-23 04:04:41

标签: angular typescript

我对在我的案例中正确使用Obervable的.expand()运算符感到困惑。搜索不会提供太多样本。

所以,我试图以递归方式运行方法/ observable并返回一个observable作为结果。看起来有点凌乱,建议如何美化它也是赞赏:))

相关代码:

方式:

 private itemsTmp:Item[] = [];
  findRecentItemsAround(radius_current?:number) {
    let radiusKm:number = radius_current? radius_current : 10;
    let radiusLimitKm:number = 50;
    this.itemsTmp = [];


    const result = Observable.create(observer => {
      this._getRecentLocalItems(radiusKm).subscribe((data) => {
        this.itemsTmp = data;
        console.log("Found items:" + this.itemsTmp.length + " radius: "+ radiusKm);
        radiusKm = radiusKm+10;

        if(this.itemsTmp.length < 1 && radiusKm <= radiusLimitKm) {
          return this.findRecentItemsAround(radiusKm);
        }
        else {
          observer.next(this.itemsTmp);
          observer.complete();
        }
      });
    });

    // result.expand(data => {
    //   console.log("In expand");
    // });

    return result;
  }

用法:

this.itemsServiceUtils.findRecentItemsAround().subscribe(data => {
  observer.next(data);
  observer.complete();
});

在当前状态下,方法不会运行第二次。如果我取消注释.expand - 收到错误result.expand is not a function请提供有关修复/正确实施的建议,因为我似乎误解了可观察的东西/弄得一团糟:D

1 个答案:

答案 0 :(得分:1)

这是一个更清洁的实现:

 getRecentLocalItems(radiusKm: number) {
     return this._getRecentLocalItems(radiusKm).map(
         t=> { return { distance: radiusKm, results: t } };
     );
 }
 findRecentItemsAround(radiusKm:number, radiusLimitKm:number)  {
     return this.getRecentLocalItems(radiusKm).expand(t=> {
          if (t.distance > radiusLimitKm-radiusKm || t.results.length > 0)
              return Observable.empty();
          return this.getRecentLocalItems(t.distance + 10);
     })
     .filter(t=> t.results.length > 0 || t.distance > radiusLimitKm);
 }

像这样使用:

this.itemsServiceUtils.findRecentItemsAround(10).subscribe(data => {
   //data.distance...
   //data.results...
});