javascript - Angular：需要解决一系列操作（可观察）

Question

我希望在用户登录我的应用程序后的第一件事就准备好一堆数据（将其缓存在服务中）。

我想在解析父路由之前实现这个数据加载逻辑，如果登录成功，用户将被重定向到，作为Resolver.

更具体地说：在显示用户主页之前，我想要一个已经加载的数据列表，如果列表不为空，则默认情况下将该列表的第一个元素设置为选定元素。所以，这意味着，两个Services：

• ItemsService：此服务将知道如何请求项目列表并在第一次请求完成后将其缓存
• ItemSelectedService：此服务将随时知道已将哪个项目设置为选中

以及以下内容Resolver：

@Injectable()
export class ItemsResolver implements Resolve<any> {

  constructor(
    private itemSelectedService: ItemSelectedService,
    private itemsService: ItemsService
  ) { }

  resolve() {
    this.itemsService.getAll()
      .subscribe((items) => {
        if (items.length > 0) {
          this.itemSelectedService.setAsSelected(items[0]);
        }
      });
  }

}

由于#resolve()需要返回一个Observable（return this.itemsService.getAll()就足够了......）但我没有返回任何东西，因为我需要订阅并itemSelectedService#setAsSelected()在异步获取项目列表后调用......实现所需的正确方法是什么行为？

标签： javascriptangularrxjsobservable

Answer 1

尝试轻按一下

resolve() {
    return this.itemsService.getAll()
    .pipe(
         tap(
             filter(items=>items.length > 0)
             do(items=>this.itemSelectedService.setAsSelected(items[0]))
         )
    );
}

do / tap
透明地执行操作或副作用，例如日志记录。 https://www.learnrxjs.io/operators/utility/do.html