当网址包含空格时，角度ng样式的背景图像

Angular ng-style background image when url contain spaces

本文关键字：样式 ng 背景 图像 角度 包含 空格      更新时间：2023-09-26

我正在尝试使用角度ng-style将背景图像应用于div，只要URL不包含空格，它就可以正常工作。

ng-style="{'background-image': 'url(' + parentIMGLink + ')'}"

当 URL 中有空格时，例如parentIMGLink = servername.images/there is name.png它不起作用。另一方面：

img ng-src={{parentIMGLink }}

工作正常。当然，我可以管理，以便服务器上的名称不包含空格，但是是否有可能使ng样式起作用？

就像在 css 中一样，您必须将图像 url 括在引号中：

.rule{ background-image: url('/some/image url.png') }

你必须在这里做同样的事情：

<div ng-style="{'background-image': 'url(''{{imageUrl}}'')'}">
你可以

试试这个。在 JS 中，将 " " 替换为 %20（百分比编码空格）。

parentIMGLink = parentIMGLink.replace(" ", "%20");
相关文章：