How would one iterate over embedded documents in Meteor?

Question

I'm in the midst of learning meteorJS, so kindly forgive my ignorance at the moment.

I have a tasks collection at the back end MongoDB which contains something like this:

{
    "name": Something",
    "Address": {
        "Building": A,
        "Street": B,
        "Locality": C
        }
}

My HTML page that contains the template looks like this:

{{#each tasks}}

        {{> task}}

  {{/each}}

<template name="task">

  <li>{{Name}}</li>
<li>{{Address}}</li>
</task>

The problem I'm facing is that the Name gets rendered fine. However, the address seems to appear as [object Object]. I'm sure that i've messed up the way I iterate over the address field. Could someone help me with that?

Answer 1

You use either the dot notation or the square bracket notation to access the fields in an embedded document:

Dot notation:

<template name="task">
    <li>{{Name}}</li>
    <li>Address
        <ul>
            <li>Building - {{Address.Building}}</li>
            <li>Street - {{Address.Street}}</li>
            <li>Locality - {{Address.Locality}}</li>
        </ul>
    </li>   
</template>

Square bracket notation:

<template name="task">
    <li>{{Name}}</li>
    <li>Address
        <ul>
            <li>Building - {{Address["Building"]}}</li>
            <li>Street - {{Address["Street"]}}</li>
            <li>Locality - {{Address["Locality"]}}</li>
        </ul>
    </li>   
</template>