Meteor: How to clear Interval () onDestroyed () created in onRendered ()

I have a countdown function to run every second, so I suggested setInterval() . After I switched to another template, the interval function continues to work. How to destroy it onDestroyed() . The code below will help you understand well.

 <template name="Home"> <h4>{{timeremaining}}</h4> </template> Template.Home.helpers({ timeremaining : function(){ return Session.get('timeremaining'); } }); Template.Home.onRendered(function () { // time functions begin var end_date = new Date(1476337380000); // I am getting timestamp from the db. var run_every_sec = setInterval(function () { var current_date = new Date(); var remaining = end_date.getTime() - current_date.getTime(); var oneDay = 24*60*60*1000; var diffDays = Math.round(Math.abs(remaining/oneDay)); console.log(remaining); // am getting this log in every template. if (remaining > 0) { //set remaining timeLeft Session.set('timeremaining',diffDays + ' Days ' + (Math.abs(end_date.getHours()-current_date.getHours())).toString() + ' Hrs ' + (Math.abs(end_date.getMinutes()-current_date.getMinutes())).toString() + ' Min ' + (60 - end_date.getSeconds()-current_date.getSeconds()).toString() + ' Sec ') } else { clearInterval(run_every_sec); } }, 1000); //time functions end }.bind(this)); Template.Home.onDestroyed(function () { clearInterval(run_every_sec); // Here I cant remove this time interval }); 

We can declare run_every_sec global function. If so, how to get through end_date . I don’t think its wise idea to declare end_date inside run_every_sec , because its exit from db.

+4
source share
3 answers

If you keep the interval in the file area, such as suggested by Repo, you will have problems if there is more than one instance for each instance of the template: both instances will use the same run_every_sec variable. In this case, you need to save the interval in the template instance, which can be accessed like this inside onRendered and onDestroyed :

 Template.Home.onRendered(function () { this.run_every_sec = setInterval(/* ... */); }); Template.Home.onDestroyed(function () { clearInterval(this.run_every_sec); }); 

Thus, each instance of the template will have its own run_every_sec property.

+5
source

You must declare "run_every_sec" outside of "onRendered".

So instead:

 Template.Home.onRendered(function () { // time functions begin var end_date = new Date(1476337380000); // I am getting timestamp from the db. var run_every_sec = setInterval(function () { 

.. do the following:

 var run_every_sec; Template.Home.onRendered(function () { // time functions begin var end_date = new Date(1476337380000); // I am getting timestamp from the db. run_every_sec = setInterval(function () { 

then it will be available in "onDestroyed"

+5
source

You should use Meteor setInterval and clearInterval to make sure they work inside the fiber. You can find more information here https://docs.meteor.com/api/timers.html .

 var intervalID Template.myTemplate.onRendered(function() { intervalID = Meteor.setInterval(function() { //do something }, 1000) }) Template.myTemplate.onDestroyed(function() { Meteor.clearInterval(intervalID) }) 
0
source

All Articles