使用ngFor时删除最后一项后的分隔符

Question

我正在使用此代码显示多个位置：

<div class="location" *ngFor="let item of location_array">
   {{item}} <hr>
</div>

导致所有位置，由水平规则分隔。如何编辑它以获得完全相同的结果，但没有最后的水平规则？

Answer 1

使用last提供的*ngFor以及*ngIf上的<hr>：

<div class="location" *ngFor="let item of location_array; let lastItem = last;">
   {{item}} <hr *ngIf="!lastItem">
</div>

这是StackBlitz Demo。

Answer 2

在当前的 Angular 版本 (11) 中，语法更改为以下内容：

<div *ngFor="let item of location_array; last as isLast">
    {{ item }} <hr *ngIf="!isLast">
</div>

见https://angular.io/api/common/NgForOf#local-variables