Nehal Hasnayeen
Nehal Hasnayeen

Reputation: 1223

how to display multi-dimensional data from collection in meteor

how to show multidimensional data from collection. say i have this

links.insert({
cat:[{
    name:'js',
    sub:[{
        name:'angularJS',
        links:[{
            url:'something.com'},{url:'another.com'}]
        },{
        name:'meteorJS',
        links:[{
            url:'something.com'},{url:'another.com'}]
        }]
    }]
});

retrieving the data in helper like this

'links':function(){
    return links.find();  // also tried links.find().fetch()

one option is that to use separate helpers for specific data. but i want to use single helper which will receive the whole data and show it like

{{‪#‎each‬ links}}
    {{cat.name}} : {{sub.name}} : {{links.url}}
{{/each}}

Upvotes: 1

Views: 325

Answers (3)

timbrandin
timbrandin

Reputation: 11

Have you tried:

{{#each link}}
    {{cat.[0].name}}  :  {{cat.[0].sub.[0].name}}  :  {{cat.[0].sub.[0].links.[0].url}}
{{/each}}

Upvotes: 1

user3557327
user3557327

Reputation: 1169

When you have to loop over the elements, you should use {{#each foo}}, where foo is the context used inside the each.

{{#each link}}
    {{ name }} :
    {{#each sub}}
        {{ name }} :
        {{#each links}}
            {{ url }}
        {{/each}}
    {{/each}}
{{/each}}

Notice it is calling {{ name }} and not {{ cat.name }}, same for the next name and for url.

Upvotes: 0

Randell S. Hynes
Randell S. Hynes

Reputation: 114

The JSON isn't valid. Your helper would look like this:

Template.yourTemplate.helpers({
      link: function () {
          var cat = [
                        {
                            "name": "meteorJS",
                            "sub": [
                                {
                                    "name": "angularJS",
                                    "links": [
                                        {
                                            "url": "something.com"
                                        },
                                        {
                                            "url": "another.com"
                                        }
                                    ]
                                },
                                {
                                    "name": "angularJS",
                                    "links": [
                                        {
                                            "url": "something.com"
                                        },
                                        {
                                            "url": "another.com"
                                        }
                                    ]
                                }
                            ],
                            "links": []
                        }
                    ];
        return cat;
      }
    });

The Template would look like this:

<template name="yourTemplate">
    {{#each link}}
        {{name}}  :  {{sub.[0].name}}  :  {{sub.[0].links.[0].url}}
    {{/each}}
</template>

Upvotes: 0

Related Questions