Отображать изображение только на одном элементе ngFor - PullRequest
1 голос
/ 05 июля 2019

У меня есть компонент временной шкалы в моем приложении, созданный с помощью цикла 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>
...