带有 Angular JS ng-repeat 的动态背景图像 [英] Dynamic background image with Angular JS ng-repeat

问题描述

我喜欢使用 angular 的 ng-repeat 指令显示动态背景图像.

Id like to display dynamic background images using angular's ng-repeat directive.

目前我通过将其设置为内联样式来做到这一点:

At the moment Im doing this by setting it as an inline style like so:

<div ng-repeat="thing in things" 
     style="background-image: url({{thing.image}})" >
</div

我更愿意使用标准的角度工具来实现这一点，并避免使用内联样式.我会使用 ng-style 设置静态背景图像，但这对于不确定数量的对象似乎不切实际.

I would prefer to use standard angular tools to accomplish this and avoid using inline styles. I would set a static background image using ng-style but this does not seem practical for an indeterminate number of objects.

对于这种情况，正确的解决方案是什么?

What is the correct solution for something like this?

推荐答案

你可以将其用于<img>标签，如下所示

you can use it into <img> tags like below

<img ng-repeat="x in array" src="{{ x.image_url }}" style="static inline stylesheet" />

或使用

<img ng-repeat="x in array" ng-src="x.image_url" style="static inline stylesheet" />

这篇关于带有 Angular JS ng-repeat 的动态背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！