[Resolved] Template Subscription Does Not Update Collection Display Until Refresh

Hi all,

I have a template (“ImageView”) displaying collection data, and I use it at two different routes to display different content: at one route it is used to display all data, and at another to display data belongs to specific user.

Because my layout has various components so I embed the ImageView template within the main template of each route (“Album” and “Profile”).

I set up the template level subscription at the two main template like so:

 Template.profile.onCreated ( function() {
     Tracker.autorun(function() {
         Meteor.subscribe('images', Meteor.userId());
     });
 });

and

 Template.Album.onCreated (function() {
     Tracker.autorun(function() {
         Meteor.subscribe('images');
     });
 })

and I have my publish like so:

 Meteor.publish('images', function ( user_id) {
     findQuery={}
     if (user_id) {
       findQuery = {userId: user_id};
     } 
     return Images.find(findQuery);
 });

The problem is that, when I navigate between the route between the two pages, the template “ImageView” will not update its content reactively, until I press refresh. (If I enter the url by hand and press enter it will also work fine).

I have console logged inside the publish function and I made sure the publication is changed when I navigate between the two routes, but the client side is not displaying correctly. I have also tried reactive-publish package, Template.subscriptionReady,FlowRouter.reload() and they dont solve the issue.

Can anyone give me insights on what the cancer might be? Btw, I am using FlowRouter.

Any inputs are appreciated. Thank you very much.

I think instead of Tracker you want to use the template instance.
Template.profile.onCreated ( function() { this.autorun(() => { this.subscribe('images', Meteor.userId()); }); });

And similar for the album template.

This is a good reference: http://guide.meteor.com/data-loading.html#organizing-subscriptions

You might also want to change your publication to use this.userId

` Meteor.publish(‘images’, function () {
findQuery={}
if (this.userId) {
findQuery = {userId: this.userId};
return Images.find(findQuery);
} else {
return this.ready();
}

});`

Thank you so much!

That solved the problem.

I did not realized I should used “this”, and thanks for the awesome reference!