angular - 如何使用异步管道和动态属性迭代对象中的数组？

Question

我有两个对象layers$，arrayByLayerId$并且我在组件中异步获取，对象的结构如下：

interface Layer {
   id: number;
   ...
}

{
   1: []
   2: []
   ...
}

有没有办法使用模板中的异步管道迭代arrayByLayerId$数组，如下所示（语法不正确，只是为了说明我试图实现的目标）：

<div *ngFor="let layer of layers$ | async"
     [attr.id]="layer.id">

    <my-component *ngFor="let array of arrayByLayerId$[layer.id] | async" [array]="array"><my-component/>
</div>

谢谢 ！

标签： angulartypescriptrxjsreactive-programming

Answer 1

arrayByLayerId$在您访问其“layer.id”属性之前还没有值。它应该是这样的：

 <my-component *ngFor="let array of (arrayByLayerId$ | async)[layer.id]" [array]="array"><my-component/>