为什么可观察管道在组件中不起作用？

Question

我有一个用 firebase/fireStore 制作的 observable。如果我在组件中订阅这个 observable，它就可以工作。但是如果我通过管道传输这个 observable，即使我期望它也不起作用。我没有收到任何错误。我的问题; 为什么它不起作用？

我的代码；

服务;

getLastSeans(uid) {
    return this.afs.doc<any>(`users/${uid}/lastseans/seansLive`).valueChanges();
  }

成分;

用管道它不起作用

this.roomService.getLastSeans(this.userId).pipe(map(x=>{console.log(x);return x;}));

如果我订阅它，它会像这样工作；

this.roomService.getLastSeans(this.userId).subscribe(x=>console.log(x));

我想了解为什么会发生这种情况？

Answer 1

Mik*_*aev 6

根据文档，添加管道不会强制评估 observable，它会使用管道中定义的额外逻辑创建新的 observable 实例：

Pipeable Operator 是一个将 Observable 作为其输入并返回另一个 Observable 的函数

要评估新的 observable，您必须对其进行评估subscribe，例如使用以下.subscribe调用：

this.roomService.getLastSeans(this.userId)
    .pipe(map(x=>{
        console.log(x);
        return x;
    })).subscribe();

请注意，.subscribe这里可以接受空，因为逻辑是在管道中定义的。

或者，更改模板以使用AsyncPipe，例如：

<app-live-sean *ngFor="let item of liveSeans | async"></app-live-sean>

假设这liveSeans是组件的字段，它设置为

this.liveSeans = this.roomService.getLastSeans(this.userId)
    .pipe(map(x=>{
        console.log(x);
        return x;
    }));

在这种情况下AsyncPipe将订阅它，接收结果并取消订阅 observable，保持内存安全无泄漏。