在流体模板中渲染图像(如果存在)? [英] Render image in fluid template if it exists?

问题描述

在尝试渲染图像之前，如何使用f:if查看图像是否存在?

How can I use f:ifto see if an image exists before trying to render it?

我尝试了以下操作但未成功:

I have tried the following without success:

{f:if(condition: page.files.0, then: ' style="background-image:url({f:uri.image(image:page.files.0, width:300c, height:200c)}"')}

<f:if condition="{page.files.0}">
    style="background-image:url({f:uri.image(image:page.files.0, width:300c, height:200c)}"
</f:if>

它在有图像的情况下起作用，但是在没有图像的情况下破坏元素.

It works if there is an image but breaks the element when there is not.

推荐答案

当我要将图像url添加到style属性时，通常会执行以下操作:

When I want to add an image url to the style attribute, I usually do something like this:

<f:if condition="{page.files.0}">
    <f:variable name="imageUri" value="{f:uri.image(
        image: page.files.0,
        width: '300c',
        height: '200c')}"/>
</f:if>

<div style="background-image: url('{imageUri}');">
   ...
</div>

如果图像不存在，那只会将其保留为空.尽管我经常遇到其他"情况，但我使用自定义的视图帮助器之一来生成占位符图像.

That would simply leave it empty in case the image does not exist. Though I often have an "else" case, where I use one of my custom viewhelpers to generate a placeholder image.

这篇关于在流体模板中渲染图像(如果存在)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！