条件声明

Question

在Sightly模板语言中,对于Adobe AEM6,如果条件为真,如何使用特定类？

$ {properties.reduceImage}是我的复选框,因此如果选中该复选框,则添加该类,否则它不会返回任何内容.我不确定我这样做是否正确.

<div data-sly-test="${properties.reduceImage}" data-sly-unwrap>
    <div class="reduce-image">
    </div>
</div>

Answer 1

Sightly的表达语言有一些允许这样做的操作符.

在您的情况下,您有两种可能:条件运算符或逻辑AND(&&)运算符.

条件运算符

这个运算符的工作方式类似于data-sly-test表达式.问号(?)之前是什么条件,然后是两个部分,用列(:)分隔.如果条件为真,则第一部分是输出,如果条件为假,则第二部分是输出(在示例中我们将其留空).

<div class="${properties.reduceImage ? 'reduce-image' : ''}">
</div>

逻辑AND运算符

这篇文章有点短,但也没有明确的意图.它使用的事实就像在JavaScript中一样,$ {value1 && value2}如果它是假的(例如false或空字符串)则返回value1,否则返回value2:

<div class="${properties.reduceImage && 'reduce-image'}">
</div>

在两个示例中,如果相应的条件为false,则将完全删除class属性,因为Sightly会删除具有最终为空或false的表达式的所有属性.