angular - Ionic 3 - ion-slide satır içi css


Ana sayfada Ionic3 uygulamam ve ion-slides bileşenim var.

<ion-slides pager>
    <ion-slide *ngFor="let blog of blogs | async" >
      <h2>{{ blog.title }}</h2>
      <p>
      <a target="_blank" class="slider-read-more" ion-button outline color="secondary" (click)="blogDetail(blog)">ვრცლად</a>
      </p>
    </ion-slide>
  </ion-slides>

Style kullanarak satır içi CSS arka plan resmi eklemek istiyorum

<ion-slide *ngFor="let blog of blogs | async" style="background:url(blog.image) no-repeat center center fixed;">

ama blog.image içini geçiremiyorum. Bunu nasıl yapabilirim?

Cevap #1

Aşağıda gösterildiği gibi deneyebilirsiniz:

yani backgroundImage öğesini bir özellik bağlaması olarak kullanın:

 <ion-slide [style.backgroundImage]="'url(' + blog.image + ')'"> ...

Cevap #2

Bir ion-slides stilini ayarlamak için ngStyle yönergesini kullandım. v-3.0

[ngStyle]="{'background-image': 'url(' + blog.image + ')'}"

İlgili makaleler