如何在一个明显的组件AEM中设置一个div的背景图像，其值来自一个对话框（图像网址）？

Question

我正在使用AEM 6.1处理一个明显的组件。我有一个对话框，我从中获取图像网址，我想将该图像设置为div的背景。

我在做的是：

<div class="hero" style= "background-image:url('/content/dam/home/hero.jpg');" >

因此，/content/dam/home/hero.jpg值将作为对话属性出现

我正在努力......

<div class="hero" style= "background-image:url('${properties.bgimage}');" >

它不起作用。如何从对话框属性中设置背景图像？

Answer 1

Sightly不会自动检测样式和脚本中的表达式上下文。我们需要明确提供。

<div class="hero" style="background-image:url('${properties.bgimage @ context='styleString'}');" >

More about Display Context here.

Answer 2

@ context ='uri'也是一个选项，因为它在技术上是css属性所期望的URI。