gulp-file-include
gulp-file-include copied to clipboard
How to loop array of objects if it is inside array of objects in the same JSON file?
I have gallery.json file with data
[
{
"id": 1,
"name": "The Starry Night ttest",
"description": "An oil on canvas painting by Dutch Post-Impressionist painter Vincent van Gogh.",
"image": "../images/gallery/old_walls.jpg",
"resources": [
{ "name":"Resource name", "type": "Image" },
{ "name":"Resource name", "type": "Image" },
{ "name":"Resource name", "type": "Image" }
]
},
{
"id": 1,
"name": "The Starry Night ttest",
"description": "An oil on canvas painting by Dutch Post-Impressionist painter Vincent van Gogh.",
"image": "../images/gallery/old_walls.jpg",
"resources": [
{ "name":"Resource name", "type": "Image" },
{ "name":"Resource name", "type": "Image" },
{ "name":"Resource name", "type": "Image" }
]
}
]
In html I'm using @@loop('./includes/components/gallery/gallery-item.html', "./gallery.json") In gallery-item.html I have
<div class="gallery__item">
<div class="row gallery__item-inner">
<a class="gallery__item-lg col-md-6 col-sm-6" href="../images/gallery/old_walls.jpg">
<img class="gallery__item-image" src="../images/gallery/old_walls.jpg" />
</a>
<div class="gallery__item-content col-md-6 col-sm-6">
<div class="gallery__item-title">@@name</div>
<div class="gallery__item-description">@@description</div>
<div class="resources-list">
@@loop('./includes/components/gallery/resource-item.html', "./gallery.json")
<div class="resource-item">
<div class="resource-item__image-wrap">
<img src="https://loremflickr.com/240/320" class="resource-item__image"/>
</div>
<div class="resource-item__content">
<div class="resource-item__name">Recource name</div>
<div class="resource-item__type">Recource type</div>
</div>
</div>
<div class="resource-item">
<div class="resource-item__image-wrap">
<img src="https://loremflickr.com/540/720" class="resource-item__image"/>
</div>
<div class="resource-item__content">
<div class="resource-item__name">Recource name</div>
<div class="resource-item__type">Recource type</div>
</div>
</div>
</div>
</div>
</div>
</div>
The question is how I can loop resources from gallery.json in gallery-item.html?