Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.

Policies for Composite Components

Avatar

Level 2

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!

3 Replies

Avatar

Level 10

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 

 

Avatar

Level 2

Hi!

 

I'm doing this to maintain some structural order of things. Going with your approach could probably fix my problem, but i would lose a lot of functionality and modularity having everything on one single node.

Like this is also easier to extend and in a case of future changes is easy as well to maintain.

 

And now with having the what they call "Core Components" one would have guesses that we could take some and create a compress component using them maintaining all the functionality of the original ones.

Avatar

Level 10

Hi,

 

I'm not sure what your use-case is exactly, but you should not lose any functionality by having everything under one component. Can you elaborate?

 

In any case, unfortunately nested policies are not possible