Sightly : How to Iterate through Map<String , Map>

To learn  how to iterate through a collection in HTL (Sightly) -- see this AEM community article: 

https://helpx.adobe.com/experience-manager/using/htl_movie62.html

This will point you in the right direction. 

if your hashMap keys are not dynamic, then below is what you can do:

• you can return iterator on first HashMap through your sightly getter method. 
• use data-sly-list.outerHash to iterate over the iterator returned value.
  • Each iteration will give you inner HashMap on object outerHash
• if you know what are going to be the keys, then you can simply access it as outerHash.key1, outerHash,key2 etc.. and it will give you access to values inside the inner hash.

-- Runal

Hi 

Wish you a wonderful new year.

HOW TO ITERATE MAP IN HTL(formerly know as sightly)
Suppose you have a Map constructed in your sling model which you want to iterate in HTL, then you can do so using below

Code in Sling Model for constructing map
private Map<Integer,String> map;

public Map<Integer,String> getMap() {
  return map;
 }

@PostConstruct
    public void constructMap() {
        map = new HashMap<Integer, String>();
        map.put(1,"A");
        map.put(2,"B")
    }

Code in HTLfor iterating the HashMap

<sly data-sly-use.model="org.training.ListingModel">
    <ul data-sly-list.key="${model.map}">
         <li> KEY: ${key}, VALUE: ${model.map[key]}</li>
    </ul>
</sly>

Output :- 
A
B

Iterate Map of List in HTL:- 
Sometimes due to HTML constraint we have to iterate over a map of list. 

For Example, suppose you have a component which displays a list of products. The products should be displayed in row wise. But the no of products in each row would be varied depending on the total no of products. This can be controlled using JavaScript as well but still you want to implement the logic in Java then you cab create a Map of List.

Code in Sling Model for constructing map
private Map<Integer,List<ProductModel>> map;

private List<ProductModel> products;

public Map<Integer,String> getMap() {
  return map;
 }

@PostConstruct
    public void constructMap() {
    map =  new HashMap<Integer, List<ProductModel>>();

    products = Lists.newArrayList();
    products.add(ele1);
    products.add(ele2);

    map.put(1,products);
       
    }

Code in HTL for iterating the List of HashMap :-
<sly data-sly-use.model="org.training.ListingModel">
<ul data-sly-list.keyName="${model.map}">
        <ul data-sly-list.key="${model.map[keyName]}">
         <li> ${key.productTitle}</li>        
       </ul>
</ul>
</sly>

Output
1
    ele1
    elem2

Source Article :- https://cqbasics.blogspot.in/2016/06/iterate-map-and-list-in-sightly-map-of.html

Reference Posts:

Link:- http://stackoverflow.com/a/26148614/6433590

Link:- http://www.wemblog.com/2016/02/how-to-sightly-in-aem-cq.html

I hope this would help you.

~kautuk

Has anyone explored why an Index cannot be used to fetch value from a Map

For example:
<sly data-sly-list="${someList}">

       ${itemList.index} /*Prints the index - 0 to length-1*/

       Consider a Map<int,string> created as

       map.put(0,'Str1')

       map.put(1,'Str2')

Now to access the Map, we are forced to iterate the keys

eg: data-sly-list="${map.keySet.iterator}" /*This prints [0,1]*/

map[item] --- results in value

map[0]  --- prints 'Str1'

map[itemList.index] -- from above list prints nothing

whereas ${itemList.index == item} does work

/*Is it not a simple solution overlooked*/

</sly>