Как установить фоновое изображение внутри div в ionic 3?

Question

Я пытаюсь отобразить изображение в качестве фона и вот как оно должно выглядеть ниже.

<ion-thumbnail item-left="" style="background-image: url(http://192.168.90.72:8000/storage/profile/853990510/profile.jpg);background-size: 100%;">
</ion-thumbnail>

Однако я хочу, чтобы он загружал изображения динамически, см. Код ниже и, к сожалению, он не работает.

<ion-thumbnail  ngStyle="background-image:url('{{ review.owner.profile.photo }}')" item-left>
</ion-thumbnail>

Может кто-нибудь помочь мне с этим?

Заранее спасибо.

Answer 1

С директивой ngStyle вот так

<ion-thumbnail  [ngStyle]="{'background-image':'url('+ review.owner.profile.photo +')'}" item-left>
</ion-thumbnail>

Answer 2

Вы можете попробовать это также

HTML

<ion-thumbnail  [ngStyle]="bgStyle" item-left></ion-thumbnail>

TS

this.bgStyle = {'background-image':`url(${this.review.owner.profile.photo})`}

Answer 3

Привет, это рабочий фрагмент здесь.

<div class="img-in-zoom-viewer" style="background-image: url({{ imgURI }})"></div>

Таким образом, я надеюсь, что вы делаете такие вещи ниже:

<ion-thumbnail style="background-image: url({{ review.owner.profile.photo }})" item-left>
</ion-thumbnail>

надеюсь, что это поможетвы.