<hr> 在 Angular 2 中每两个项目后添加 *ngFor

Question

我有以下 ngFor 代码，它循环遍历一个对象。

<a *ngFor="let pictures of picturesData" href="">
  <img [src]="pictures.img" alt="">
</a>

我想在每 2 个 <a> 个标签之后(但不在最后 2 个标签之后(显示一个<hr>，以获得类似于以下内容的输出：

<a href=""><img /></a>
<a href=""><img /></a>
<hr>
<a href=""><img /></a>
<a href=""><img /></a>
<hr>
<a href=""><img /></a>
<a href=""><img /></a>

我该怎么做？请帮助我。

Answer 1

使用 ngFor 的 odd 属性和 ng-container

<ng-container *ngFor="let pictures of picturesData; let odd=odd">
  <a href="">
    <img [src]="pictures.img" alt="">
  </a>
  <hr *ngIf='odd'>
</ng-container>