How do I control two subscriptions to display within a single template?

Question

Sorry kind of new to the Meteor framework!

I Subscribed to two Publish functions. Even if both publish functions target the same Collection, they both have different functions, that I would like to display in one template. How do I achieve this. I have done allot of research but there doesn't seem to be sufficient information on how to achieve.

Following are the two publish functions in code that I subscribe to:

.server/main.js:

Meteor.publish('MerchantTrending', function (categoryMan){
var currentUser = this.userId;

return buyList.find({ who:"Merchant", ownerId:currentUser, itemCategory: { $in: categoryMan } }, {skip: 0, limit: 3});

});

.server/main.js:

Meteor.publish('myTopViews', function (){

var currentUser = this.userId;
return buyList.find({ newArrivalsExpiryDate : {'$lte': new Date()}}, {ownerId:currentUser }, {skip: 0, limit: 3});
});

Following is the subscription function in code

.client/main.js:

Router.route('/MerchantLandingPage', {    
subscriptions: function(){
      var categoryMan = Session.get('category');

    return  Meteor.subscribe('MerchantTrending', categoryMan, 'merchantTopViews')

}
});

Now the helper function in code:

Template.MerchantLandingPage.helpers({

  'top3Trending' : function () {    
    return buyList.find({}).fetch();
    },

 'myTopViews' : function () {

    return buyList.find({}).fetch();
    }
});

And now the template in code:

<template name="MerchantLandingPage">

##### *** Top three trending items *** ########

{{#each top3Trending}}

ItemName::  <b>{{itemName}}</b> <br>
Item Category:: <b>{{itemCategory}}</b> <br>                 
Discription:: <b>{{descriptions}}</b> <br>  
Image:: {{this.photo._id}} <br> 
Date Created:: {{createdDate}} <br>  

{{/each}}

<br><br>

 ############ *** My top Views *** #############

{{#each myTopViews}}

ItemName::  <b>{{itemName}}</b> <br>
Item Category:: <b>{{itemCategory}}</b> <br>                 
Discription:: <b>{{descriptions}}</b> <br>  
Image:: {{this.photo._id}} <br> 
Date Created:: {{createdDate}} <br>   

{{/each}}

</template>

Both {{#each myTopViews}} and {{#each top3Trending}} successfully display but not correctly. When the variable categoryMan in

Meteor.subscribe('MerchantTrending', categoryMan, 'merchantTopViews')

changes value, it affects both both the outcome of both {{#each myTopViews}} and {{#each top3Trending}}, when its only supposed to affect {{#each top3Trending}}.

How can I get the subscriptions to NOT have an affect on both {{#each myTopViews}} and {{#each top3Trending}}, but only {{#each myTopViews}} in my template?

Thanks for the help!

What about publishing the collection from server with necessary fields and apply the selectors in client side? — Mostafiz Rahman

ghybs ghybs · Accepted Answer · 2017-02-16T12:35:54

Welcome to Meteor!

The solution is straight forward once you understand that:

Subscription is just a stream of your DB documents from server into your client's MiniMongoDB. So your 2 subscriptions (it is perfectly fine having several subs on the same Collection) just fill in your client's buyList local collection.
Use of Collections client side is generally independent from how you subscribe the data. So you should simply use a similar selector and possibly options in your top3Trending and myTopViews helpers as you have done for your publication server side (not the same between the 2 helpers, obviously).

As a side note, you do not even need to fetch() the Collection cursor returned by find(), Blaze knows how to handle it directly.

How do I control two subscriptions to display within a single template?

3 Answers