displaying nested json data using each in Emberjs

Question

I have successfully displayed JSON objects unto my template thanks the answer on my previous stackoverflow post setting data from route to controller error in Emberjs

Now, I am trying to display a nested JSON data objects to my template using the {{#each}} helper.

here is my code: http://screencast.com/t/3fhpckr4E

It doesn't give me any errors on my dev console and also it just gives me blank text. I've also wrote the code in different ways but still no luck..

any feedback would be appreciated

thanks,

Answer 1

You can do this in your template as follows:

<script type="text/x-handlebars" data-template-name="index">
  <ul>
  {{#each item in model}}
    <li>{{item.description}}</li>
    <ul>
    {{#each childItem in item.items}}
      <li>{{childItem.title}}</li>
    {{/each}}
    </ul>
  {{/each}}
  </ul>
</script>

Working solution here

The problem with what you are doing is that there is no such thing as data.items.items. Each item in the data.items array has its own items property...