Dynamic background image

Asked

Viewed 77 times

0

I have a list of products, clicking on some of them, redirects to another page showing only the content of this item. I receive the Image, but I would like it to be in the background, that is, it will show the same image in large size, and with text and etc written on top. Is it possible from my HTML I set the image as background? Because to receive it I am using <img src="{{produto.nom_pathimagem}}" class="bgimage" >. So I can’t set a default value in scss. Thanks for any help :D

1 answer

-1

Declare in style. Example:

<div style="background-image:url('{{ produto.nom_pathimagem }}')"></div>

;)

  • did not work. On my way in the database to receive the images is: assets/imgs/id-1.png . So in html I’m using <img src="{{produto.nom_pathimagem}}" class="bgimage" >. I tried your solution but nothing came up. You know what can be?

  • checked in the console?

  • I get this: WARNING: sanitizing unsafe style value background-image:url('Assets/imgs/id-1.png') (see http://g.co/ng/security#xss).

  • It is possible through scss I set the background-image dynamically?

  • At angular 6.1 running on localhost here worked. try using ng-style instead of style.

  • ng-style="{'background-image':'url(/{{ product.pathfigure }})'}"

  • Error: Cannot find a differ supporting Object '{'background-image':'url(/Assets/imgs/id-1.png)'}' used <div ngStyle="{'background-image':'url(/{{ produto.nom_pathimagem }})'}"></div>

Show 2 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.