Angular ng style image when url contains spaces
I am trying to apply a background image to a div using angular ng-style
and it works fine as long as the url contains no spaces.
ng-style="{'background-image': 'url(' + parentIMGLink + ')'}"
When there is a space in the url, for example parentIMGLink = servername.images/there is name.png
, it doesn't work. On the other hand:
img ng-src={{parentIMGLink }}
Works great. Of course, I can manage so that the names on the server do not contain spaces, but is there a way to do the ng-style work?
+3
sniegoman
source
to share
2 answers
As with css, you have to wrap the image url in quotes:
.rule{ background-image: url('/some/image url.png') }
You have to do the same here:
<div ng-style="{'background-image': 'url(\'{{imageUrl}}\')'}">
+6
epignosisx
source
to share
You can try this. In JS, replace "" with% 20 (Proportional Space).
parentIMGLink = parentIMGLink.replace(" ", "%20");
+3
Gustaf gunér
source
to share