如何在不订阅的情况下将 Observable<Product[]> 转换为 Observable<Product>[]？答案

【问题标题】：How to convert Observable<Product[]> to Observable<Product>[] without subscribe?如何在不订阅的情况下将 Observable<Product[]> 转换为 Observable<Product>[]？
【发布时间】：2020-10-17 19:46:24
【问题描述】：

在我当前的 Angular 项目中，我有一个返回 Observable 的服务。我想将该流转换为单个产品的 Observables 数组。我想使用管道运算符来实现这一点，而无需订阅原始流。

从的 Observable 到实体的 Observable 数组

【问题讨论】：

我认为管道运算符不可能做到这一点，因为管道方法只接受生成一个可观察对象的运算符。也许您可以通过创建一个 BehaviorSubjects 数组并将结果推送到那里来做到这一点。
感谢@ShamPooSham。我会试试的。
老实说，我不确定你想用这个完成什么。从您的其他评论看来，您希望使用*ngFor 和async 循环遍历模板中的结果。 Observable<etntity[]> 并非不可能实现这一点。也许你的问题应该是关于那个
我觉得我的解决方案相当丑陋，并且使代码更难推理。
如果在简单的 div 上循环，则不需要这样做。实际上，我用 *ngFor 循环的组件期望一个可观察的单个实体。 .

标签： angular rxjs observable rxjs-observables rxjs-pipeable-operators

【解决方案1】：

当您在 observable 上使用 pipe 时，您将总是返回一个新的 observable，而不是数组。您可以毫无问题地访问Product[] 并将其映射到(Observable<Product>)[]，但结果仍将包装在另一个可观察对象中：

import { of } from 'rxjs';
import { map } from 'rxjs/operators';

interface Product {
    id: number;
}

const products: Observable<Product[]> = of([
    { id: 1 },
    { id: 2 },
    { id: 3 },
]);

products
    .pipe(map(ps => ps.map((p) => of(p))))
    .subscribe((observables: Observable<Product>[]) => {
        // In here you can access the array of observables:
        console.log(observables);
    })

除了订阅 observable 之外，您还可以在 pipe 中使用 tap 访问 map() 的结果，但结果仍然只能从 Observable 上下文中访问：

// ...
import { map, tap } from 'rxjs/operators';
// ...

const x = products
    .pipe(
        map(ps => ps.map((p) => of(p))),
        tap((observables: Observable<Product>[]) => {
            // In here you can also access the array of observables:
            console.log(observables);
        }),
    );

但x 仍然是可观察的：

const x: Observable<Observable<Product>[]>

或等效但可能更容易理解：

const x: Observable<Array<Observable<Product>>>

【讨论】：

有助于理解的一点是，在 observables 的上下文中不知道事件数组有多少条目。数组不受限制，因此不能动态拆分为多个变量。 Pairwise 正在做他想做的事，但操作员只分成两个独立的部分。
谢谢杰弗里，这很有意义。但是不可能使用异步管道循环遍历模板中的可观察对象。