My project involves working with two datasets - one defines the included items for a page, while the other contains deeper data. To simplify, let's refer to the first dataset as page.json:
{
"title": "pageTitle here",
"description": "Content here",
"items": [
{
"id": 14,
"name": "Bob"
},
{
"id": 11,
"name": "Dave"
},
{
"id": 12,
"name": "Fred"
}
]
}
The second dataset, known as data.json, includes:
[
{
"id": 14
"name": "Bob Matthews",
"description": "Some description here about Bob",
"age": 24,
"location": "Sydney"
},
{
"id": 11
"name": "Dave Smith",
"description": "Some description here about Dave",
"age": 23,
"location": "Sydney"
},
{
"id": 12
"name": "Fred Williams",
"description": "Some description here about Fred",
"age": 42,
"location": "Sydney"
}
]
In the templates, I attempt to display the data like so:
<!-- Loop through each person for this page from page.json -->
{{#each page}}
<!-- Find and display data for this person from data.json -->
{{#compare page.id data.id}}
<h2>{{data.name}}</h2>
<p>Description {{data.description}}</p>
<p>Age {{data.age}}</p>
<p>Location {{data.location}}
{{/compare}}
{{/each}}
However, this method does not work. Is there a way without creating a custom handlebar helper to access and display data from an item in a separate JSON data source array?
Note: The project uses Assemble.io & Grunt to build static pages from JSON data sets.
Thank you!