[RESOLVE] List of Ion-Cards

Hi guys,

I needed a list of items of ion-cards with images and ion-fac icon…

I have this but don’t run correctly. Only print the img, not buttons, not ion-icon, not card-title…

    <ion-list>
      <ion-item-sliding *ngFor="let country of s">countries
          <ion-card>
              
                <ion-card-header>
                  Card Header
                </ion-card-header>
              
                <ion-card-content>
                 Lalala
                </ion-card-content>
              
              </ion-card>
      </ion-item-sliding>
    </ion-list>

The old code is here, in this code I haven’t a list, writing directly in the html

<ion-card>
    <img src="assets/img/fondojpg" (click)="show()" />
    <ion-fab right bottom>
      <button ion-fab (click)="edit()">
      <ion-icon name="brush"></ion-icon>
    </button>
    </ion-fab>
    <div class="card-title">Amsterdam</div>
  </ion-card>

 <ion-card>
    <img src="assets/img/fondo2.jpg" (click)="show()" />
    <ion-fab right bottom>
      <button ion-fab (click)="edit()">
      <ion-icon name="brush"></ion-icon>
    </button>
    </ion-fab>
    <div class="card-title">Amsterdam</div>
  </ion-card>

 <ion-card>
    <img src="assets/img/fondo3.jpg" (click)="show()" />
    <ion-fab right bottom>
      <button ion-fab (click)="edit()">
      <ion-icon name="brush"></ion-icon>
    </button>
    </ion-fab>
    <div class="card-title">Amsterdam</div>
  </ion-card>

I needed convert it to a dynamic list

Someone can help me?

Thx

1 Like
<ion-list>
    <ion-item-sliding *ngFor="let country of countries">
      <ion-item>
        <ion-card>
            <img [src]="urlImg" (click)="show()" />
            <ion-fab right bottom>
                <button ion-fab (click)="edit()">
                <ion-icon name="brush"></ion-icon>
              </button>
              </ion-fab>
              <div class="card-title">Amsterdam</div>

        </ion-card>
      </ion-item>
    </ion-item-sliding>
  </ion-list>
6 Likes

i had same issue but now it’s solve through your answer, thanks a lott…

This just helped me too, thanks NurGuz :+1:

1 Like