仅在一个ngFor元素上显示图像

时间:2019-07-05 11:55:18

标签: angular ionic4 ngfor

我的应用程序中有一个由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>

0 个答案:

没有答案