Css ng类不'；渲染后不设置图像背景

我希望使用ng样式动态设置div的背景图像。有几个答案，但都不适合我。 我意识到，对于如下所示的一个简单案例，没有问题

<li ng-style="{'background-image': 'url({{ image.source }})'}">...</li>

但是假设你有以下几点：

<li ng-style="{'background-image': 'url({{ item.image_url }})'}">...</li>

项目在呈现模板后变为可用。我发现angular只是将背景图像设置为主机url

<li ng-style="{'background-image': 'url({{ item.image_url }})'}" style="background-image: url(http://localhost:3000/);">
</li>

我可以使用一个自定义指令来实现这一点，但是如果有一个简单的方法来实现这一点，我更喜欢这个而不是一个指令

下面是一个plunker演示了这个问题：

---

ng style已经绑定了范围变量，因此您不需要添加大括号，只需输入正确的字符串值即可：

ng-style="{'background-image': 'url(' + item.image_url + ')' }"

---

ng style已经绑定了范围变量，因此您不需要添加大括号，只需输入正确的字符串值即可：

ng-style="{'background-image': 'url(' + item.image_url + ')' }"

在呈现元素之后，item.image\u url获取值时，如果是，请使用ng

在呈现元素之后，item.image\u url获取值时，如果是，请使用ng

ng-style="{'background-image': 'url(' + item.image_url + ')' }"

<div ng-if="item.image_url" class="img-div" ng-style="{'background-image': 'url({{item.image_url}})' }"></div>

ng-style="{'background-image': 'url({{item.image_url}})' }"