I am facing a challenge while trying to structure a table of orders in Meteor. Specifically, I am having difficulty displaying a nested array within the document. Below is the code snippet I am working with:
Collection data
{
"_id" : "tDLaCMSde3QyneJqm",
"orderNumber" : 1234,
"createdAt" : ISODate("2016-01-11T11:14:21.986Z"),
"productsInOrder" : [
{
"item" : 10300,
"desc" : "Ergonomic Wooden Fish",
"quantity" : "43",
"price" : "0.92",
"lineprice" : "39.56",
"_id" : "BQeEwtGQEDpPxA6ZM"
},
{
"item" : 98517,
"desc" : "Refined Concrete Soap",
"quantity" : "10",
"price" : "2.11",
"lineprice" : "21.10",
"_id" : "YqBdy8aLJovuncQce"
},
{
"item" : 69824,
"desc" : "Incredible Frozen Gloves",
"quantity" : "7",
"price" : "3.79",
"lineprice" : "26.53",
"_id" : "EefPSwLHCFyJuzXcT"
},
{
"item" : 14897,
"desc" : "Intelligent Frozen Towels",
"quantity" : "3",
"price" : "4.15",
"lineprice" : "12.45",
"_id" : "BSg32fTmpqZBdM2eT"
}
]
}
HTML/Spacebars
<template name="orders">
<table class="table table-striped">
<thead>
<tr>
<th>
Order Number
</th>
<th>
Ordered on
</th>
<th>
Items in order
</th>
</tr>
</thead>
<tbody>
{{#each orders}}
<tr>
<td>
{{orderNumber}}
</td>
<td>
{{createdAt}}
</td>
<td>
{{productsInOrder}}
</td>
</tr>
{{/each}}
</tbody>
</table>
</template>
JS/Helpers
Template.orders.helpers({
'orders': function() {
return Orders.find({});
}
});
Rendered output
https://i.sstatic.net/Qy4VP.png Upon inspection, it seems that the 'Items in order' section is not showing the correct information as expected. Could someone kindly guide me on where I might be making an error? Thank you so much for your assistance.