Traverse through nodes and consume data into Sling Model

[arindam6600]

I have an asset in /content/dam/myproject/<assetFile> the hierarchy being :

I will get the path of the image from dialog and I have injected the same in the sling model.

@inject
private String imagePath

 My ultimate aim is to traverse to the metadata node and get a certain property from there. 

Can someone please help me with the Java code for that? Also please let me know how I will get that data into frontend via HTL.

Thanks!

[EstebanBustamante · Accepted solution]

Hi, you can just adapt the resource (your image block.png) to an Asset object and then get the AssetMetaData object

You can use something like this:

@Model(adaptables = { SlingHttpServletRequest.class,
        Resource.class }, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL, resourceType = "myproject/components/content/image")
@Exporter(name = "jackson", extensions = "json", options = {
        @ExporterOption(name = "MapperFeature.SORT_PROPERTIES_ALPHABETICALLY", value = "true")
})
public class ImageModel {
    private static Logger LOG = LoggerFactory.getLogger(ImageModel.class);

    @SlingObject
    private SlingHttpServletRequest request;

    private String imageMetaData;

    /**
     *  Returns the property tiff:ImageWidth from the metadata
     */
    public String getImageMetaData() {
        String url = request.getRequestURI();
        //You can get this path dynamically from HTL or resolve by other means, for now is just hardcoded
        Resource resource = request.getResourceResolver().getResource("/content/dam/my-project/image/image.png");
        Asset asset = resource.adaptTo(Asset.class);
        String width = asset.getMetadataValue("tiff:ImageWidth");
        return this.imageMetaData;
    }
}

And then use it in the HTL like this:

<!--/* Invoke the model you have created and access the method where you have obtained the information */-->
<div data-sly-use.model="com.my.models.package.ImageModel">
    <p>${model.imageMetaData @ context='html'}</p>
</div>

You can learn more here:
https://redquark.org/aem/day-07-sling-models/

http://www.aemcq5tutorials.com/tutorials/sling-model-sightly-aem/ 

[arindam6600]

Hi @EstebanBustamante , can you please let me know why we are using the exporter annotation? I don't want to export the content to json or any other form, then what is the sue of @Exporter annotation.

[arindam6600]

@EstebanBustamante  -  Also I'm getting an error like the following when I'm using the above snippet. But the error goes away when I remove the following in HTL.

@ context='html'

[EstebanBustamante]

@arindam6600 I have provided a sample or guidance about how you can accomplish what you have asked, but I encourage you to write your own code instead of copy/paste mine, that's the reason I left resource for an understanding of what's going in my code, that being said, you can remove the Exporter annotation if that's not required for your use case. It looks like you already know the purpose of the Exporter annotation so I won't explain further.

In regards to the context="html" piece, the error says that there is a syntaxis issue, it does not recognize the "{" char, this may be caused due the quotation, make sure those are correct in your code, sometimes copying text will transform the quotation into some strange chars which looks like char. But as I said earlier, you can remove it if you need to, you can learn more about context here: https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#121-display-context 

[arindam6600]

Thank you @EstebanBustamante