How to use handlebars to handle complex JSON data like this?

I have read couple posts about handling complex JSON data but haven't found anything similar to the problem I currently have.

Here's how my data is formatted:

         var data = {

             "results":{
                 "employees":[
             {"firstName":{"type":"Name", "value":"Doe"}, 
              "lastName":{"type":"Name", "value":"Smith"},
              "birthDay":{"type":"Date", "value":"June"}
             },

             {"firstName":{"type":"Name", "value":"Lucy"}, 
               "lastName":{"type":"Name", "value":"Lee"},
               "birthDay":{"type":"Date", "value":"October"}
             }
             ]
         }}

I want to grab all the first names and I have experimented something like this which didn't work:

            {{#each results.employees}}
                   {{#each firstName}}
                  Name: {{value}}<br>
                {{/each}}
            {{/each}}

The data is parsed through a website and formatted in this way. Preferably I don't want to re-format the JSON file.

The #each statement is for iterating through an array. The only array in your data is employees. The top level element is results, then you have the employees array as a child, which has a child called firstName, which has a child called value.

Just follow the same hierarchy:

{{#each results.employees}}
   Name: {{firstName.value}}
{{/each}}

Points to remember:

  1. Only use #each on an array element
  2. Work your way down the hierarchy by using the property accessor (dot notation)
  3. You must end on a literal value (like a string), or it will print out [object] as you discovered

To me it seems that results is not an array so you should not use an each there instead use something like this 

{{#each results.employees }}
  Name: {{firstName}}<br>
{{/each}}