我的应用程序中有一个由ngFor循环生成的时间轴组件。但是我想在第一个卡片元素中显示图像,但是用ngFor图像会显示几次。
html文件
<timeline color='primary'>
<timeline-item *ngFor="let note of notes;index as i">
<ion-icon name="calendar"></ion-icon>
<ion-card [ngClass]="note.card ? 'card-item' : 'no-card' ">
<ion-card-header>
<b>Date:</b> {{note?.Created}}
</ion-card-header>
<ion-card-content [ngClass]="isMenuOpen[i] ? 'active' : 'inactive'" *ngFor='let ind of individuals'>
<ion-list>
<b>Injury On Arrival:</b> {{note?.Notes}}
</ion-list>
<ion-list>
<b>Injury Desc:</b> {{ind.InjuryDesc}}
</ion-list>
<ion-list>
Posted By: {{ind.FirstNameUser}} {{ind.LastNameUser}}
</ion-list>
<ion-list *ngFor='let img of pImages'>
<ion-col *ngIf='ind.Created === img.Added'>
<img src = "http://ccoulter12.lampt.eeecs.qub.ac.uk/api/{{img.Image}}"/>
</ion-col>
</ion-list>
</ion-card-content>
</ion-card>
</timeline-item>
</timeline>