Extra parameters in data-sly-resource

[David_Woollard]

I am trying to implement something which I hope is relatively straight forward...  I have one component (lets call it the wrapper component) which contains another component (lets call it the inner component) inside it via the data-sly-resource tag:

<div data-sly-resource="${ 'inner' @ resourceType='/projectname/components/inner' }"></div>

I would like to pass in some additional parameters with this tag, specifically a parameter that can be picked up by sightly in the inner component template?  I am trying to specify whether the inner templates outer html tag is unwrapped based on a parameter being passed in when the component is called via data-sly-resource.

After experimenting and perusing the sightly documentation, I can't find a way of achieving this.

Does anyone know if this is possible?

Many thanks,

Dave

[Feike_Visser1]

hi dave,

With data-sly-resource you can't pass in extra argument of parameters.

I think what you are looking for is data-sly-template / data-sly-call.

best,

Feike

[David_Woollard]

Morning Feike! That sounds like exactly what I am looking for, but I do not know how to then create the different templates that respond to different selectors? Any help would be much appreciated Cheers, Dave

[David_Woollard]

Hello, it's me again!

I am now running into an issue upon updating my inner component via the inline editing function author.edit.actions.doUpdate(editable, params), which saves the data fine, but updates the UI without using the selector that is defined in the template...

so for example say I have:

<data-sly-resource="${ 'inner' @ resourceType='/projectname/components/inner', selectors='different'}"></div>

When the inline editor updates this component, it is refreshing it without the selector of 'different'...

Do you know if this is a bug? Or is there an extra parameter I should be using when I perform the doUpdate function?

Thanks for your help yet again!

Dave

[Feike_Visser1 · Accepted solution]

<div data-sly-resource="${ 'inner' @ resourceType='/projectname/components/inner', selectors='different' }"></div>

What you can do is the following:

you have your inner.html as the default, now you create a different.html file in your component. This will be used when the selector='different' is specified.

Or what you can do is to do a check in a WCMUse class whether a specific selector is specified.

Can you test the first approach?

best,

Feike

[Feike_Visser1]

Example

<template data-sly-template.test1="${ @ param1}">
This is from the template... ${param1}
</template>

<div data-sly-call="${ test1 @ param1 = 'Hello World'}">
</div>

[David_Woollard]

Thank you for your help Feike, that is marvellous!

[David_Woollard]

Hi Feike,

Thank you for your swift response!

I have used data-sly-template and data-sly-call elsewhere in my component and am very happy with how they work, however they do not solve the problem at hand.

Lets look at the problem another way... I have a component called Heading.  This component can be used all over the site.  If this component appears inside the Hero component then I want it to render slightly differently.  

Can you suggest a way I might achieve this?

Thanks for your help!

Dave

[Feike_Visser1]

hi dave,

This might work for you....

<div data-sly-resource="${ 'inner' @ resourceType='/projectname/components/inner', selectors='different' }"></div>

Now depending on the selector you can render your component in a different way.

WDYT?

best,
Feike

[Feike_Visser1]

Since AEM6.3 you can pass in a requestParameter object into data-sly-resource.

[tobiasn29237871]

Hi Feike,

how to pass requestParameter into data-sly-resource?

Cannot find anything in HTL Spec htl-spec/SPECIFICATION.md at master · Adobe-Marketing-Cloud/htl-spec · GitHub

Thanks,

Tobias

[edubey]

It has been documented here in helpx under Request Attributes section

https://helpx.adobe.com/experience-manager/htl/using/block-statements.html

Sample code

<sly data-sly-use.settings="com.adobe.examples.htl.core.hashmap.Settings"

        data-sly-include="${ 'productdetails.html' @ requestAttributes=settings.settings}" />

[tobiasn29237871]

Great, thanks!

[akashs51893872]

Hello,

Here's an example on implementation with HTL (formerly Sightly) Passing request attributes with Sightly · GitHub.

Good Luck...