在 Angular 中组合可观察数据的正确方法是什么？

Question

我对 RxJS 和异步数据没有太多经验。我一直在嵌套订阅，感觉不对。我想知道组合或使用多个数据点的正确方法是什么，例如获取用户个人资料及其帖子。这是我目前拥有的：

  constructor(private storage: AngularFireStorage, private db: AngularFirestore, private route: ActivatedRoute) {
    // Get profile
    this.route.paramMap.subscribe(params => {
      const profileName = params.get('id');
      const username = db.doc<any>('usernames/' + profileName).valueChanges();
      username.subscribe(val => {
        this.user = db.doc<User>('users/' + val.user).valueChanges();
        this.user.subscribe(val => {
          const userPosts = this.db.collection<Post>('posts', ref => ref.where('user', '==', val.uid)).snapshotChanges();
          this.posts = userPosts.pipe(map(actions => actions.map(a => {
            const data = a.payload.doc.data() as Post;
            const mediaUrl = this.storage.ref('post/m/' + data.mediaM).getDownloadURL();
            const userData: Observable<User> = db.doc<User>('users/' + data.user).valueChanges();

            return {mediaUrl, userData, ...data}
          })))
        });
      });
    });
  }

Answer 1

您可以使用 switchMap 将结果从一个 observable 传递到另一个 observable，这样您就不需要嵌套订阅。

this.route.paramMap.pipe(
  map(params => params.get('id')),
  switchMap(profileName => db.doc<any>('usernames/' + profileName).valueChanges()),
  switchMap(val => db.doc<User>('users/' + val.user).valueChanges()),
  switchMap(val => this.db.collection<Post>('posts', ref => ref.where('user', '==', val.uid)).snapshotChanges())
).subscribe(val => {});