Expand my Community achievements bar.

Based on the flag view should load either from react or AEM

Avatar

Level 1

There is one AEM component where HTML is getting load from the AEM component but the requirement is there should be some condition when it is true HTML should load from AEM component(i.e. sightly) and when condition is false HTML should load from the react component. 

1 Reply

Avatar

Level 6

Hi @AnamikaP 
Considering your use case, you have both renditions of the component.
In one you are loading from react ( ui.frontend module ) and in another you are directly using HTL to show component HTML.
If that is the case you can modify your component HTL in such a way that when the flag is true you show the div with is the react container , thus react will pick up this container and load the component. And in case flag value is false, you can show just the HTL.

<sly data-sly-test="${properties.loadFromReactFlag}">
  <div id="react-container"></div>
</sly>
<sly data-sly-test="!${properties.loadFromReactFlag}">
  <p>Loaded from AEM</p>
</sly>