Policies for Composite Components

Avatar

Avatar

mrpoofy

Avatar

mrpoofy

mrpoofy

27-03-2020

Hi guys, i'm having some problems creating a policy for a custom component that i'm creating. I have something like this:

 

<div data-sly-use.template="core/wcm/components/commons/v1/templates.html">
	<sly data-sly-resource="${ 'image' @ resourceType='core/wcm/components/image/v2/image'}"></sly>
	<sly data-sly-resource="${ 'title' @ resourceType='core/wcm/components/title/v2/title'}"></sly>
	<sly data-sly-resource="${ 'text' @ resourceType='core/wcm/components/text/v2/text'}"></sly>
</div>
<sly data-sly-call="${templates.placeholder @ isEmpty = false}"></sly>

 

 And i want to give policies for each component inside of it (image, title and text components), and the component is not going to be static in a template, so i can't just add it to the structure of a component and assigned the policies for each. The component is going to be used as any other components in a container and there will be more than one used in the same page.

I tried to search for something like this, but or all of the examples where for simple components or when i found questions for other guys having the same issues as me, there were no responses.

 

Thanks in advance!

Accepted Solutions (0)

Answers (1)

Answers (1)

Avatar

Avatar

Theo_Pendle

MVP

Avatar

Theo_Pendle

MVP

Theo_Pendle
MVP

27-03-2020

Hi Mr. Poofy 

 

This is an excellent question! Here is an excellent question of my own: Is there any reason in particular that you want your component to "spawn" a child node for each of the composite components?

 

For example:

<sly data-sly-resource="${ 'image' @ resourceType='core/wcm/components/image/v2/image'}"></sly>

Will place an Image content on the page (as you no doubt know). Then, when an author sets a property on the Image component it will be written to JCR as a child node of your component.

 

Let's say an Author adds an asset to the the Image component. If your component is at /content/yoursite/en/home/jcr:content/root/responsivegrid/yourcomponent, AEM will create a node at /content/yoursite/en/home/jcr:content/root/responsivegrid/yourcomponent/image and give it a fileReference property pointing to the asset in question.

 

Now let's look at the following HTL: 

<sly data-sly-resource="${ '.' @ resourceType='core/wcm/components/image/v2/image'}"></sly>

This is almost exactly the same as yours except now we are telling AEM not to write the properties to a child node but to write them to THIS node (ie: /content/yoursite/en/home/jcr:content/root/responsivegrid/yourcomponent, in our example).

 

If you do it this way, you can create a cq:design_dialog which lets template authors set policies directly on yourcomponent without having to worry about nesting 🙂