AEM 6.0:使用data-sly-resource时的附加参数?

Dav*_*ard 12 aem sightly

我正在尝试实现一些我希望相对简单的东西...我有一个组件(让我们称之为包装器组件),它包含另一个组件(让我们称之为内部组件)通过data-sly-resource标签:

<div data-sly-resource="${ 'inner' @ resourceType='/projectname/components/inner' }"></div>
Run Code Online (Sandbox Code Playgroud)

我想用这个标签传递一些额外的参数,特别是一个可以在内部组件模板中选择的参数?我试图指定是否根据通过data-sly-resource调用组件时传入的参数来解包内部模板外部html标记.

在试验和仔细阅读文档后,我无法找到实现这一目标的方法.

有谁知道这是否可能?

非常感谢,

戴夫

Gab*_*alt 8

如果此处提出的备选方案不适合您,您可以使用Use-API来编写和读取请求属性.

两个组件的快速示例,其中外部组件设置由内部组件显示的属性:

/apps/siteName/components/
    outer/ [cq:Component]
        outer.html
    inner/ [cq:Component]
        inner.html
    utils/ [nt:folder]
        setAttributes.js
        getAttributes.js
/content/outer/ [sling:resourceType=siteName/components/outer]
    inner [sling:resourceType=siteName/components/inner]
Run Code Online (Sandbox Code Playgroud)

/apps/siteName/components/outer/outer.html:

<h1>Outer</h1>
<div data-sly-use="${'../utils/setAttributes.js' @ foo = 1, bar = 2}"
     data-sly-resource="inner"></div>
Run Code Online (Sandbox Code Playgroud)

/apps/siteName/components/inner/inner.html:

<h1>Inner</h1>
<dl data-sly-use.attrs="${'../utils/getAttributes.js' @ names = ['foo', 'bar']}"
    data-sly-list="${attrs}">
    <dt>${item}</dt> <dd>${attrs[item]}</dd>
</dl>
Run Code Online (Sandbox Code Playgroud)

/apps/siteName/components/utils/setAttributes.js:

use(function () {
    var i;
    for (i in this) {
        request.setAttribute(i, this[i]);
    }
});
Run Code Online (Sandbox Code Playgroud)

/apps/siteName/components/utils/getAttributes.js:

use(function () {
    var o = {}, i, l, name;
    for (i = 0, l = this.names.length; i < l; i += 1) {
        name = this.names[i];
        o[name] = request.getAttribute(name);
    }
    return o;
});
Run Code Online (Sandbox Code Playgroud)

访问/content/outer.html时产生的结果:

<h1>Outer</h1>
<div>
    <h1>Inner</h1>
    <dl>
        <dt>bar</dt> <dd>2</dd>
        <dt>foo</dt> <dd>1</dd>
    </dl>
</div>
Run Code Online (Sandbox Code Playgroud)

正如@AlasdairMcLeay评论的那样,如果内部组件在请求中被多次包含,则此提议的解决方案存在问题:组件的后续实例仍将看到最初设置的属性.

这可以通过在访问它们时删除属性来解决(在getAttributes.js中).但是,如果将内部组件拆分为多个需要访问这些属性的Sightly(或JSP)文件,这将再次成为一个问题,因为访问请求属性的第一个文件也会删除它们.

这可以通过一个标志进一步解决,告诉他们在访问它们时应该删除属性......但它也说明了为什么使用请求属性不是一个好的模式,因为它基本上包括使用全局变量作为一种方式在组件之间进行通信.因此,如果此处提出的其他两种解决方案不是一种选择,请将此视为解决方法.

  • 刚刚意识到我们可以通过在第一次检索到getAttributes.js(或类似)之后清除变量来解决这个问题. (2认同)

Han*_*örr 5

有一个较新的功能,可以在data-sly-include和data-sly-resource上设置请求属性

<sly data-sly-include="${ 'something.html' @ requestAttributes=amapofattributes}" />
Run Code Online (Sandbox Code Playgroud)

不幸的是,似乎不可能用HTL(= Sightly)表达式构造Map,而且我看不到从HTL读取请求属性的方法,因此您仍然需要一些Java / Js代码。


san*_*zky 0

很不幸的是,不行。没有办法扩展视觉功能。您无法添加新的数据隐藏属性或修改现有属性。你能做的最好的事情就是使用USE API编写你自己的助手