0

下面是一个组件的 HTL 文件中的一段代码:

<p id="info" data-sly-use.info="info-text.js">
    ${info.text}
</p>

这是 info-text.js

use(function () {

    // TODO: change currentStyle to wcm.currentStyle

    var CONST = {
        PROP_INFO_TEXT: "infoText",
        PROP_DEFAULT_TEXT: "Enter information text here"
    }

    var info = {};

    // The actual title content
    info.text = granite.resource.properties[CONST.PROP_INFO_TEXT]
        || CONST.PROP_DEFAULT_TEXT


    return info;
});

PROP_DEFAULT_TEXT 是在 infoText 属性尚未创建时显示在页面上的默认文本。我希望以某种方式为这个默认文本“在此处输入信息文本”提供样式。我尝试使用

PROP_DEFAULT_TEXT: "<p style='default-text'>Enter information text here</p>"

但在页面上它看起来像下面的简单文本:

在此处输入图像描述

我不确定我是否使用了 HTL Context 来使其工作,我尝试了一些事情,但它不会工作。所以,我不知道我应该怎么做才能让它工作。

提前致谢

4

1 回答 1

1

首先style="default-text"是不正确的 CSS,请使用正确的 CSS 规则和style属性。

其次,当尝试通过 HTL 表达式呈现 HTML 时,必须将显示上下文设置为html

${info.text @context='html'}

注意:使用github.com/Adobe-Marketing-Cloud/aem-htl-repl进行快速 HTL 测试。

于 2018-04-18T18:08:02.200 回答