时间戳

首页 > 解决方案 > 从列表中检索到的所选项目的新列表

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>

标签： htmlangularrxjs

解决方案

使用异步管道时，最好使用 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>

推荐阅读