How I can include xf directly (not through parsys) in aem component through sightly | Experience Fragments | HTL | Adobe Higher Education
Skip to main content
Abhishekty
Abhishekty
Level 4
July 5, 2022
해결됨

How I can include xf directly (not through parsys) in aem component through sightly | Experience Fragments | HTL

  • July 5, 2022
  • 2 답변들
  • 1231 조회

 

Can I include xf directly on the AEM component through Sightly?

 

For ex:

 

this is existing code: 

 <sly data-sly-test=${currentStyle.myFlag}>
data-sly-resource="${ @9556322='myContent', resourceType='/apps/my-common/components/content/mycomponent'}"
data-sly-unwrap="${!wcmmode.edit}"></div>
</sly> 

 

But now I have created an xf for mycomponent and now I want to directly use it on the AEM component.

 

Like: 

 

 <sly data-sly-test=${currentStyle.myFlag}>
data-sly-resource="${ @9556322='myXf', resourceType='content/experience-fragments/sprint/shared/mycomponentXF'}"
data-sly-unwrap="${!wcmmode.edit}"></div>
</sly> 

 

Can anyone suggest is this possible or a good approach?

    최고의 답변: Manu_Mathew_

    @abhishekty 

    Hard Coded Example
    The first example uses sightly to reference an experience fragment, /content/experience-fragments/we-retail/equipment, and the required variation, master. This will only work when the path includes the experience fragment variation path. The value here is hard coded.

    <sly data-sly-resource="${@path='/content/experience-fragments/we-retail/equipment/master',
       selectors='content', wcmmode='disabled'}"></sly>
    Dynamic Example
    In the second example, we can see that our component adapts to the com.mysite.models.component.MyCustomComponent, Sling Model backend, and then it exposes the experience fragment in the exPath property. The value returned from the exPath is ‘/content/experience-fragments/we-retail/equipment/master’.

    <sly data-sly-use.cmp="com.mysite.models.component.MyCustomComponent"></sly>
    <sly data-sly-resource="${@path=cmp.exPath,
       selectors='content', wcmmode='disabled'}"></sly>

     

    2 답변

    SantoshSai
    Community Advisor
    SantoshSaiCommunity Advisor
    Community Advisor
    July 5, 2022

    Hi @abhishekty ,

    Try this,

    <sly data-sly-resource="${@path='content/experience-fragments/sprint/shared/mycomponentXF',
   selectors='content', wcmmode='disabled'}"></sly>

    Hope that helps!

    Regards,

    Santosh

    Santosh Sai
      Manu_Mathew_
      Community Advisor
      Manu_Mathew_Community Advisor답변
      Community Advisor
      July 7, 2022

      @abhishekty 

      Hard Coded Example
      The first example uses sightly to reference an experience fragment, /content/experience-fragments/we-retail/equipment, and the required variation, master. This will only work when the path includes the experience fragment variation path. The value here is hard coded.

      <sly data-sly-resource="${@path='/content/experience-fragments/we-retail/equipment/master',
         selectors='content', wcmmode='disabled'}"></sly>
      Dynamic Example
      In the second example, we can see that our component adapts to the com.mysite.models.component.MyCustomComponent, Sling Model backend, and then it exposes the experience fragment in the exPath property. The value returned from the exPath is ‘/content/experience-fragments/we-retail/equipment/master’.

      <sly data-sly-use.cmp="com.mysite.models.component.MyCustomComponent"></sly>
      <sly data-sly-resource="${@path=cmp.exPath,
         selectors='content', wcmmode='disabled'}"></sly>

       

        약관 및 조건Accessibility statement

        Loading footer...