Search code examples
javascriptjsonmeteorspacebarsmeteor-helper

Why does nothing display in my Meteor application?


I've got this in my client.js file

Template.data.champ = Meteor.call("checkLeague", function(error, results) {
        console.log(results.data.data);
        return results.data.data;
});

So it shows fine in the console.log but it doesn't actually show on the webpage.

This is my html file with handlebars template

<body>
  {{> hello}}
  {{> data}}
</body>

<template name="hello">
  <h1>Hello World!</h1>
  {{greeting}}
  <input type="button" value="Click" />
</template>

<template name="data">
    {{#each champ}}
        {{name}}
    {{/each}}
</template>

From my understanding (which is very limited in terms of Handlebars) but the {{#each champ}} iterates over objects? But for some reason, nothing is being displayed on the page.

This is the object structure (displayed in the console).

Object {Aatrox: Object, Ahri: Object, Akali: Object, Alistar: Object, Amumu: Object…}
Aatrox: Object
   id: "Aatrox"
   image: Object
   key: "266"
   name: "Aatrox"
   title: "the Darkin Blade"
   __proto__: Object
Ahri: Object
Akali: Object
Alistar: Object
Amumu: Object
Anivia: Object
Annie: Object
Ashe: Object

So basically I am passing an object that has properties which have values of objects. I assume the {{#each} iterates over the properties and gives access to the values (which is an object) and then I try to access the name property of that variable in the handlebars template but it doesn't work.


Solution

  • Peppe's answer is correct - here is an option for how to deal with this situation:

    Template.data.created = function() {
      Meteor.call('checkLeague', function(error, results) {
        Session.set('champ', results.data.data);
      });
    };
    
    Template.data.champ = function() {
      return Session.get('champ');
    };
    

    The data is loaded when the template is created, and asynchronously stored into a session variable. Keep in mind that this isn't reactive, but that's hard to overcome since your data is coming from a method call.