在同一个Observable上Async pipe和subscribe

Question

我在模板中使用async管道来获取匹配特定条件(getNonRedirectingList)的用户列表。用户存储在Firestore实例中。

在我的组件模板中，我有以下(简化)代码:

<div *ngIf="users$ | async as users" class="uwrapper">
<div *ngFor="let u of users">{{u.name}}</div>
</div>

，这就像一个魅力:它产生3个<div>块，匹配我期待的3个用户。

然而，在Typescript代码中，我还需要订阅相同的Observable,@angular/fire返回

ngOnInit(): void {
this.users$ = this.userSvc.getNonRedirectingList().pipe(share());
firstValueFrom(this.users$).then(users => {
for (let i = 0; i < users.length; i++) {
console.log(i);
}
});
}

,我希望

0
1
2

作为控制台中的输出，但是我什么也没有得到。即使在console.log(i)行设置了断点，它也不会被击中。

我已经尝试过和没有.pipe(share())，我也试过两次调用getNonRedirectingList，希望得到两个不同的Observable，我也试过使用subscribe()和unsubscribe()代替firstValueFrom()，但结果是一样的:异步管道工作，我的代码没有。

S Overflow回答后编辑:

也试过了，结果也一样

this.users$.pipe(tap(users => {
for (let i = 0; i < users.length; i++) {
console.log(i);
}
}));

什么线索吗?

Answer 1

使用async管道，您已经订阅了Observable，因此不需要其他任何东西，只需添加操作符，就像tap一样记录值:

this.users$ = this.userSvc.getNonRedirectingList().pipe(tap(console.log));

Answer 2

CheckThis

this.todosList = this.appService.getTodos().pipe(tap((x:any) => {
x.map(i => console.log(i.id))
}))