如何访问数组中的特定元素 - 角度模板？

Question

目前我正在使用 angular 开发一个网页 - 我有一个包含 2 个项目的类，如下所示：

Array(2)
 0: uiData { id: 12, price: 324 }
 1: uiData { id: 23, price: 432 }

我正在尝试以角度模板访问这些数据

<div *ngFor="let item of uiData">
    price: {{item.price}}
</div>

输出：我得到的是如下

price: 324
price: 432

我正在寻找的所需输出是

price: 324/432

尝试通过提供 index 来访问数据，例如 uiData[0].price/uiData[1].price 但这不起作用。

有没有办法访问这些项目？

Answer 1

您应该能够通过重新打开另一个 {{}} 来访问这些数据

<div>
    price: {{uiData[0].price}}/{{uiData[1].price}}
</div>

如果你不想直接访问范围 0 和 1 的数据，你也可以像这样循环数组

<div>
    price: 
    <span *ngFor="let item of uiData;last as isLast">
      {{item.price}}
      <ng-container *ngIf="!isLast">/</ng-container>
   </span
</div>

Answer 2

你可以这样写：

<div> price: <span *ngFor="let item of uiData;index as i">
    {{item.price}}
        <span *ngIf="i!=(uiData?.length-1)">/
        </span>
    </span>
</div>