How to display values in a List of a SlingModel using Sightly

Question

I am not able to display values in a lit that are part of a POJO/SlingModel. Please help.

Desired Output
Commodity 1
Product 1, Product 2, Product 3

Commodity 2
Product 2, Product 4, Product 5

Sightly Code

<!-- LIST :: SLING MODEL -- FINAL -->
<div data-sly-  
use.model="${'com.tti.tticommons.service.models.LeadTimeTrendsModel' @ 
rawJson=ws.JSON}" data-sly-unwrap>  
   <div data-sly-list.commodity="${model.getProductsList}">
        <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Sling Model(List) - ${commodity.name @   
context='html'}</h3>                    
            </div>
            <div class="panel-body" data-sly-
list.pr="${model.getProductsList.getProducts}">
                <div class="col-md-4 col-sm-12 industry list-group no-
border">
                    <div>
                         <a class="">                                 
                             ${model.getProductsList.getProducts[pr]}
                         </a>
                    </div>
                </div>
            </div>   
        </div>
    </div>
</div>

My Sling Model Class

public class LeadTimeTrends {

private List<Commodity> productsList;

public List<Commodity> getProductsList() {
  ...business logic...
  ...........  
  return productsList;
}

public class Commodity {
  public String code;
  public String name;
  public LinkedHashMap<String, Product> products;

  public void Commodity(String code, String name, LinkedHashMap<String,     
  Product> products) {
    this.code=code;
    this.name=name;
    this.products=products;
  }

  public LinkedHashMap<String, Product> getProducts() {
    return this.products;
  }
}

/***/
public class Product {
  public String code;
  public String name;

  public Product() {
  }

  public Product(String code, String name) {
    this.code=code;
    this.name=name;
  }        
}
}

Answer 1

After some research and careful checks i found the solution to be working.

Output as desired

Here's the final code:

Sightly code block

<!-- LIST :: SLING MODEL -- FINAL -->
<div data-sly-use.model = 
"${'com.tti.tticommons.service.models.LeadTimeTrendsModel' @   
rawJson=ws.JSON, configurationId='leadtimetrends', webService=ws}"
data-sly-unwrap>  
   <div data-sly-list.commodity="${model.getProductsList}" data-sly-unwrap>
        <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Sling Model(List) - ${commodity.name @ 
              context='html'}</h3>                    
            </div>
            <div class="panel-body" data-sly-list.product =  
           "${commodity.products}">
                <div class="col-md-4 col-sm-12 industry 
                 list-group no-border">
                    <div>
                         <a class="">             
                             ${product.name}                                 
                         </a>
                    </div>
                </div>
            </div>   
        </div>
    </div>
</div>

Sling Model Class

/** Sling Model class */
@Model(adaptables={Resource.class, SlingHttpServletRequest.class})
public class LeadTimeTrends {
  private List<Commodity> productsList;

  /** */
  public List<Commodity> getProductsList() {        
    List<Commodity> productsList = buildProductsList(this.rawJson);        
    return productsList;
  }

  /** */
  public List<Commodity> buildProductsList(String rawJson){
    List<Commodity> productList = new ArrayList<Commodity>();
    ....business logic....
    ......................
    return productList;
  }

  /** */
  public class Commodity {
    public String code;
    public String name;
    public List<Product> products;

    public void Commodity() {
    }

    public void Commodity(String code, String name, List<Product> products)    
    {
        this.code=code;
        this.name=name;
        this.products=products;
    }
 }

 /** */
 public class Product {
    public String code;
    public String name;

    public Product() {
    }

    public Product(String code, String name) {
        this.code=code;
        this.name=name;
    }    
 }