Question

<div *ngFor="let item of list">
  <div *ngIf="item == previousItem"></div>
  <div *ngIf="item == firstItem"></div>
</div>

我们怎样才能使这类事物发挥作用？也就是说，我们如何才能访问列表中的其他项目（1）与当前索引相关或（2）绝对索引？

编辑：如果列表是Observable会怎么样？

<div *ngFor="let item of observable">
  <div *ngIf="item == previousItem"></div>
  <div *ngIf="item == firstItem"></div>
</div>

Answer 1

您可以利用index

的*ngFor属性

<div *ngFor="let item of list; let i = index;">
  <div *ngIf="item == list[i-1]"></div>
  <div *ngIf="item == list[0]"></div>
</div>

您可以在文档中找到有关*ngFor局部变量的更多信息：https://angular.io/docs/ts/latest/api/common/index/NgFor-directive.html

Answer 2

根据接受的答案，我发现这很有用。如果您使用* ngFor进行异步调用，则可以执行以下操作：

<div *ngFor="let item of list | async as items; let i = index;">
  <div *ngIf="items.length > 0 && item === items[i-1]"></div>
  <div *ngIf="item === items[0]"></div>
</div>

如何访问ngFor循环中的previous / later元素？

2 个答案: