search

mujtaba01 / ngx-owl-carousel

An angular2 (4) wrapper for jquery owl-carousel library with dynamic carousel item change detection
MIT License
70 stars 25 forks source link

Cannot display images #48

Open smlombardi opened 6 years ago

smlombardi commented 6 years ago

Using the documentation example: <div class="thumbnail-image" [ngStyle]="{'background': 'url('abc.jpg')no-repeat scroll center center / 80px 80px'}"></div>

Throws a compile error: Parser Error: Missing expected } at column 22 in [{'background': 'url('abc.jpg')no-repeat scroll center center / 80px 80px'}]

I've tried every combination of background, using a simple background: red compiles.

Also, what's with the abc.jpg? How to use the image in the loop let image of images? My images is an array of image url strings.

I can get images to at least display if I use this instead: 

<div class="thumbnail-image">
     <img src="{{image}}"  alt="">
</div>

But this doesn't seem to be the way it's designed?

bekzatsk commented 6 years ago

<div class="thumbnail-image" [ngStyle]="{'background': 'url(' + abc.jpg + ')no-repeat scroll center center / 80px 80px'}">

bekzatsk commented 6 years ago

[<div class="thumbnail-image" [ngStyle]="{'background':'url(' + abc.jpg + ')no-repeatscroll center center / 80px 80px'}"></div>]