Angular 如何合并两个rxjs数据并在模板中显示？

我有两个可观察的数据：

$selectedGroups: Observable<number[]>;
$groups: Observable<[{id: number, name: string}]>;

$selectedGroups：可观察；
$组：可观察；

内部模板：

<app-registry-block *ngFor="let block of $groups | async">
  <div *ngIf="block.id in $selectedGroups">{{block.name}}</div>
</app-registry-block>

{{block.name}

---

当

$selectedGroups

中存在块id时，如何使用

*ngIf

显示组件？

您可以筛选组件中的选定组：

$selectedGroupIds：可观察；
$组：可观察；
//在前两个文件被初始化之后
$selectedGroups=CombineTest（[$SelectedGroupId，$groups]）
.烟斗(
map（（[selectedGroupIds，groups]）=>groups.filter（g=>selectedGroupIds.includes（g.id）））
);

然后在模板中：

<app-registry-block *ngFor="let block of $groups | async">
  <div *ngIf="block.id in $selectedGroups">{{block.name}}</div>
</app-registry-block>

{{block.name}

---

注意：我会为组类型使用一个接口：

导出接口组{
id：编号；
名称：字符串；
}

然后代码变成：

$组：可观察；
$selectedGroups | async
像这样：
*ngIf=“block.id in$selectedGroups | async”
？实践可以吗？如果修改初始响应
$groups:
并添加属性：
opend:boolean
，然后在Temapte中只使用
$groups
？是
[{id:number，name:string}]
真的是预期类型吗？或者你的意思是
{id:number，name:string}[]
？这意味着你有一种
{id:number，name:string}[]
[{id:number，name:string}]
将是一个只包含一个元素的
{id:number，name:string}
数组。如果服务器返回一个
{id:number，name:string}
数组，则不需要进行转换。只需在http调用中传递泛型类型：
this.httpClient.get（url）
。在Redux效果中，我从服务器
{Id:number，title:string，prop:true，items:[]}
。在哪个步骤上，将此数据转换为
组{id:number，name:string}
。内部效应、组件内效应或减速器内效应？