How to show a single value from a meteor collection in a template?

help
1

Hi.

I want to display an object from a collection in meteor using handlebars.

I have prepare this example about what I have so far.

Collection: Transactions.

Server side:

Meteor.publish(‘getTransaction’, function(transactionid){
return Transactions.find({transactionid:transactionid});
});

Client side:

HTML

<template name='MainTransac'>
<body>
  <div class="panel panel-primary">
    <div class="panel-heading">
        <h3 class="panel-title" align="center">General information</h3>
    </div>
    <div class="panel-body">
              <table class="table table-striped">
                <tbody>
                   <tr>
                    <td>TransactionID:</td>
                   </tr>
                   <tr>
                        {{#each Task}}
                             <td>{{transactionid}}</td>
                       {{/each}}
                   </tr>
                </tbody>    
              </table>
    </div>
  </div>   
</body>
</template>

JS

Template.MainTransac.onCreated(function(){
this.subscribe(‘getTransaction’,Router.current().params.transactionid);
});

Template.MainTransac.helpers({
Task: function()
{
return Transactions.find({});
}
});

As you can see I have receiving the transactionid from another page. But I am not able to know how can I show the table with the transaction id or any other field from the transaction document.

In subscribe if I change the Router.Current().params for the explicit value returned it works.

Template.MainTransac.onCreated(function(){
var num = Router.current().params.transactionid;
console.log(num); [The value here is 9]
this.subscribe(‘getTransaction’,9);
});

I really appreciate all your help about it. If you have any question just let me know, have a great day.

2

Try wrapping your subscribe call in an autorun to make sure your subscription is adjusted when your transactionid parameter changes. For example:

Template.MainTransac.onCreated(function () { 
  this.autorun(() => {
    this.subscribe('getTransaction', Router.current().params.transactionid); 
  });
});
3

Hi, thank you so much for all your help.

And I made the change as requested, but I am still not able to get value. For example:

If I put this:

Template.MainTransac.onCreated(function () {
this.autorun(() => {
this.subscribe(‘getTransaction’, Router.current().params.transactionid);
});
});

The information is not displayed and through console.logs I know that the server side is receiving the value 9

But If I put this:

Template.MainTransac.onCreated(function () {
this.autorun(() => {
this.subscribe(‘getTransaction’, 9);
});
});

The information is displayed, but I don’t know why it’s not working. I have performed a meteor rebuild but without results.

I really appreciate all your help about it. If it’s not a problem, we can perform a skype call or something in order to show you the project and the code running.

4

Add a console.log statement within your autorun block:

Template.MainTransac.onCreated(function () { 
  this.autorun(() => {
    let transactionId = Router.current().params.transactionid;
    console.log(transactionId);
    this.subscribe('getTransaction', transactionId); 
  });
});

What do you see in your browser console when accessing the page?

And just to double check - based on using Router, I’m assuming you’re using Iron Router and not Flow Router, correct? (as with Flow Router current() is not reactive and the solution is a bit different).

5

I have performed the log as requested on my browser and I am able to look the 9 returned.

Screenshot: http://prntscr.com/bqdach

And yes, I am using Iron Router: http://prntscr.com/bqdbj3

I really appreciate all your help and time on this matter.

6

Can you show us your router config? In particular the part that defines your transactionid based route.

7

Sure:

Router.route("/List/Transaction/:transactionid", function() {
this.render(‘MainTransac’);
},{
name : “MainTransac”
});

This transactionid comes from another page where shows the list of transactions:

Router.route("/List/:Status", function() {
this.render(‘ListTransactions’);
},{
name : “ListTransactions”
});

8

Within your publish first console.log the incoming transactionid and check your server log to make sure it’s set properly. Then you might want to force it to be an int when adding it to the Mongo query, like:

Meteor.publish('getTransaction', function (transactionid) {
  return Transactions.find({ transactionid: parseInt(transactionid) });
});

This is in-case it’s being sent in as a string and you’re actually storing numbers in your collection. This would help explain why when you hard code a number it works, but when it’s coming from the route it fails - one is really a number, the other is really a string.

9

Thank you so much for all your help about it. The issue has been fixed successfully.

Have a great day my friend.