如何访问ngFor循环中的上一个/后一个元素？

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>