Accessing Array from Handlebars

Question

const data = {
 customer:{
  name:[{
         user 1
        },
        {
         user 2
        },
        {
         user 3
        }],
  users : 2
 }
}

Printing data of newest user in a view template using:

{{#each data}}
  {{this.customer.name.[this.customer.users]}}
{{/each}}

The output is

: N/A

Are There any solution to print the newest user data?

Answer 1

Yes, it is possible.

But first, you will need to determine which property of each name object you wish to render. You have included invalid JavaScript for each object in your name array (ex., { user 1 } ), and so, I must guess on how you plan to use these objects. I am going to assume these objects have a shape like { value: "user 1" } .

Since you wish to lookup an object on the customer.name array using another variable, customer.user as the index, you will need to use the built-in Lookup helper. In fact, you will need to use it twice : once to get the object out of customer.name at the customer.user index, and then to get the value of the value property off of the returned object.

Fortunately, Handlebars support Subexpressions to do this kind of lookup nesting. Our template now becomes:

<p>
  Newest username is...
  {{lookup (lookup customer.name customer.users) 'value'}}
</p>

I have created a fiddle for reference.