Policies for Composite Components



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>
<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)




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 🙂