Jason Chen
Jason Chen

Reputation: 2577

Meteor for each on template?

In jQuery I have the following:

var dis = $('.dis').children();
for (var i = 0; i <= dis.length; i++){
$(dis.find('.somediv')[i]).text(funk.list[i].api.response);}

I am trying to change the formatting of my code to be reactive with Meteor. To that end, I am trying to convert my code like so:

this.mete = new ReactiveVar();
var self = this;
self.mete[i].set('funk.list[i].api.response');

The gist of all of this is that, in my jQuery code, I have a for-each loop that needs to be reflected in the [i] tags surrounding each div.

My HTML is something like so:

<div class="dis"><div class="somediv"></div></div> <div class="dis"><div class="somediv"></div></div>

The self.mete[i].set does not accomplish this. I would like to know how to go about this. Also, I understand that, in Meteor, the HTML would look something more like:

<div class="dis">{{mete}}</div>
<div class="dis">{{mete}}</div> 

Upvotes: 0

Views: 88

Answers (1)

MrE
MrE

Reputation: 20768

You probably want something like this:

Template.mytemplate.onCreated(function(){
    this.mete = new ReactiveVar();
    var self = this;
    self.mete.set(YourListHere); //assuming your list is an array of object like {api: {response: "some response"}} 
});
Template.mytemplate.helper({
   "myList": function() {
      return Template.instance().mete.get();
   }
});

and in the template:

{{#each myList}}
<div class="dis">{{this.api.response}}</div>
{{/each}}

Upvotes: 1

Related Questions