Meteor js | Display Json in view via helper

Question

I'm struggling with an issue using Meteor JS.

I call an API which return me a JSON array which look like the one returned on this URL (I don't put the whole array here cause of the size): https://blockchain.info/address/12c6DSiU4Rq3P4ZxziKxzrL5LmMBrzjrJX?format=json&offset=0

I call it server side like:

if (Meteor.isServer) {
    Meteor.methods({
       getWalletPreviousTx: function() {
       var url = "https://blockchain.info/address/12c6DSiU4Rq3P4ZxziKxzrL5LmMBrzjrJX?format=json&offset=0";
       var result = Meteor.http.get(url);
       if(result.statusCode==200) {
            var tx = JSON.parse(result.content);
            return tx;
       } else {
            console.log("Response issue: ", result.statusCode);
            var errorJson = JSON.parse(result.content);
            throwError("Couldn't fetch wallet balance from Blockchain, try again later !");
        }
      }
    });
}

And I retrieve it to my view via an helper in a specific template:

Template.wallet.helpers({
    addrTxs: function () {
      Meteor.call('getWalletPreviousTx', function(err, tx) {
         console.log(tx);
         return [tx];
      });
    }
});

The console.log in the helper actually logs my JSON array which means it has access to it. Now the part I'm struggling with is to retrieve this JSON to my view, I've tried a lot of way and none of them works, actually I have this in my view:

<template name="wallet">
    <table>
            {{#each addrTxs}}
                <ul>
                    {{> addrTx}}
                </ul>
            {{/each }}
     </table>
</template>

The part of the JSON I want to display is the "addr" and "value" of each transactions:

"inputs":[
  {
     "sequence":4294967295,
     "prev_out":{
        "spent":true,
        "tx_index":97744124,
        "type":0,
        "addr":"1AWAsn8rhT555RmbMDXXqzrCscPJ5is5ja",
        "value":50000,
        "n":0,
        "script":"76a914683d704735fd591ba9f9aebef27c6ef00cbd857188ac"
     }
  }
]

Fact is, I never managed to display anything from this JSON array in my view, even putting directly this in my view doesn't show anything:

{{addrTxs}}

What am I doing wrong? Can anyone help with this?

Thanks for reading.

----------------------- Edit ---------------------

I think the problem is more that my helper and template are loaded before the API call is finished (because the console.log appear in my console like 3 seconds after my page is rendered). How can I make my helper wait until the API call is finished before rendering it in the view? I use iron router.

I have tried to add a waitOn action on my route in order to wait until my API call is finished:

Router.route('/wallet', {
  name: 'wallet',
  template: 'wallet',
  loadingTemplate: 'loading',
  waitOn: function () {
    Meteor.call('getWalletPreviousTx', function(error, result) {
    if(!error) {
       Ready.set(result)
    }
  });
  return [
    function () { return Ready.get(); }
  ];
 },
 action: function () {
    if (this.ready())
      this.render();
    else
      this.render('loading');
 }

});

The above code with the waitOn action seems to work (I have no errors) but I don't know the way to display in my view the specific result from:

if(!error) {
   Ready.set(result)
}

Nicolas Charpentier · Accepted Answer · 2015-10-06 15:39:58Z

1

Transactions are contained in tx.txs, iterates through that.

Template.wallet.helpers({
    addrTxs: function () {
      Meteor.call('getWalletPreviousTx', function(err, tx) {
         console.log(tx);
         return tx.txs;
      });
    }
});

You're right, you need to use the sessions variables with async call.

First, call method on created :

Template.wallet.created = function () {
  Meteor.call('getWalletPreviousTx', function(err, tx) {
     console.log(tx.txs);
     Session.set('tx', tx.txs);
  });
};

Helper should look like this :

Template.wallet.helpers({
  addrTxs: function () {
    return Session.get('tx');
  }
});

edited Oct 6, 2015 at 15:39

answered Oct 6, 2015 at 13:46

Nicolas Charpentier

1,1281 gold badge11 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Samaan Over a year ago

Thanks for responding. I tried with your way, nothing happened in my view but if i console.log(tx.txs) it returns the array of arrays wich i need. I think the problem isn't in my view code but more in the fact that the api call isn't finished when the helper is rendered in the view. How can i wait until the call is finished before loading the template ?

Nicolas Charpentier Over a year ago

Can you provide the template you call with {{> addrTx}} ?

Samaan Over a year ago

This is my template <template name="wallet"> <table> {{#each addrTxs}} <tr> <td>{{> addrTx}}</td> </tr> {{/each }} </table> </template> But i really think the problem come from the fact that my serverside call isn't finished before my template is loading. I updated my issue with a waitOn function on my route.

Samaan Over a year ago

We're getting closer, i did your way with the Session.get and now im printing something in my view : <table> {{#each addrTxs}} <td>{{this}}</td> {{/each}} </table> This code display [object ][object ][object ]... in my view. If i replace {{this}} by {{> addrTx}} it print nothing !

Nicolas Charpentier Over a year ago

I don't know why you want to use the template {{> addrTx }} if it doesn't exist ? Instead, you can display {{ inputs[0].prev_out.addr }} and {{ inputs[0].prev_out.value }}

|

Collectives™ on Stack Overflow

Meteor js | Display Json in view via helper

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related