Creating A Numbered List For Meteor Data

Is there a way to get 'the number' for a numbered list of the items I have in a Meteor collection. I know I can do it in html, but I feel like it would be much easier to style if I

Solution 1:

I do not properly understand your question, neither do I know much about Meteor-Collections, but in general, if you iterate over an Array and want to get the index of each element, you could do it easily with:

[1,2,3].forEach(function(e,i){ console.log(i+":"+e); })

 0:11:22:3

See MDN for forEach().

Solution 2:

There is pull request which does exactly what you want:

{{#each movie}}
   {{@index}}{{movie}}
{{/each}}

Until they merge it you can use other approach:

How can I get the index of an array in a Meteor template each loop?

Solution 3:

Try it with using "map" from Underscore.js.

I'm expecting you have movies in your "Movie" collection and they look something like this:

{
    title: "Shawshank Redemption",
    score: 92
},
{
    title: "Forrest Gump",
    score: 96
},
{
    title: "Green Mile",
    score: 91
},
{
    title: "The Godfather",
    score: 95
}

... and so on ...

And here is "yourTemplate" helper function:

Template.yourTemplate.helpers({
    movie: function () {
        var loadMovies = Movie.find({}, {sort: {score: -1}, limit: 20}).fetch(); // added descending sorting by review scorevararray = _.map(loadMovies, function(movie, index) {
            return {
                    number: index+1, // incrementing by 1 so you won't get 0 at the start of the list
                    movie_name: movie.title,
                    review_score: movie.score
                   };
        });
        returnarray;
    }
});

So now you can use it in your template like this:

<template name="yourTemplate">
    {{#each movie}}
         Movie #{{number}} {{movie_name}} {{review_score}}
    {{/each}}
</template>