Html 从列表中新检索到的选定项列表

我有一个从后端从对象检索数据的列表，在从该列表中选择一个项目后，它应该显示它的项目，但我不知道如何在html或rxjs中呈现它

这是我从列表中选择项目

Test1

后的当前状态，它检索其内部项目

info 1

和

info 2

List:
  List: Array(2)
     0: {name: "Test1", item: Array(2)}
     1: {name: "Test2", item: Array(1)}
     length: 2
     __proto__: Array(0)
   selectedItemData: Array(2)
     0: {name: "info 1", item: Array(1)}
     1: {name: "info 2", item: Array(4)}

但是列表并没有改变，即使在检索每个选定项的部分时一切都正常

这是我的html：

      <ul class="unstyled" *ngFor="let i of (listObservable$|async).list.List">
        <li><a (click)="selected(i.name)">{{i.name}}</a></li>
      </ul>

{{i.name}

使用异步管道时，最好使用ngIf并将其映射到视图变量，以便仅在发出可观察对象后渲染元素

<ng-container *ngIf="listObservable$ | async as listObj">
  <ul class="unstyled" *ngFor="let i of listObj.list.List">
    <li><a (click)="selected(i.name)">{{i.name}}</a></li>
  </ul>
</ng-container>

{{i.name}

应该

（listObservable$| async）。list

应该是大写的

list

像这样

（listObservable$|async）。list

？它实际上是（listObservable$| async）。list.list，很抱歉这是个错误，我用我的模型更新了