2017-03-02 3 views
0

Ich versuche, mehrere Timer auf einer Vorlage anzuzeigen. Meine Vorlage onCreated-Funktion ist unten angegebenMehrere Timer auf einer einzelnen Seite in einer Meteor-Anwendung

});

});

Ich zeige jede Instanz der Vorlage mit einem Helfer namens lastDate().

Template.viewTeamTermPaper.helpers({ 
    lastDate(){ 
    let papers = TeamTermPaper.find({}).fetch(); 
    return papers.map(function(paper){ 
    let obj = {} 
    obj.paper = paper; 
    Template.instance().lastDateSubmit.set(paper.last_submission_date); 
    obj.time = Template.instance().timeLapse.get() 
    //arr.push(obj) 
    return obj 
}); 

//return arr; 

}

});

Ich habe eine Funktion, die die verstrichene Zeit berechnet.

 function getTimeRemaining (endtime){ 
     let t = Date.parse(endtime) - new Date(); 
     let seconds = ("0" + Math.floor((t/1000) % 60)).slice(-2); 
     let minutes = ("0" + Math.floor((t/1000/60) % 60)).slice(-2); 
     let hours = ("0" + Math.floor((t/(1000 * 60 * 60)) % 24)).slice(-2); 
     let days = Math.floor(t/(1000*60*60*24)); 

     if (t <= 0){ 
      //clearInterval(timeInterval); 
     } 

     return { 
      'total' : t, 
      'days' : days, 
      'hours' : hours, 
      'minutes': minutes, 
      'seconds' : seconds 
     } 

}

Dies ist, wie ich löschte die Instanz der Vorlage

<template name="viewTeamTermPaper"> 
    {{#each lastDate}} 
     {{> studentViewTeamPaper}} 
    {{/each}} 
    </template> 

Mein Problem ist, ich den gleichen Zeitgeber für jedes Element, das stattdessen in dem lastdate Helfer enthalten ist, von verschiedene Countdown-Timer. Ich dachte, vielleicht für jedes Element in meiner Sammlung sollte ich eine reaktive Variable erstellen, die in einem Array gespeichert werden kann. Ich weiß nicht, wie ich diesen Gedankengang angehen soll. Jede Hilfe wird wirklich geschätzt.

+0

Können Sie Ihren Code für die Vorlage 'studentViewTeamPaper' bereitstellen? – jordanwillis

+0

@jordanwillis Ich habe den Code hinzugefügt. Vielen Dank –

+0

Sie versuchen, alles von der übergeordneten Vorlage statt von der einzelnen Artikelvorlage zu steuern. Wenn Sie den Countdown-Timer auf der unteren Ebene definieren, erhalten Sie automatisch einen anderen Timer. Sehen Sie sich auch das Paket [remcoder: chronos] (https://atmospherejs.com/remcoder/chronos) an, das die Zeit reaktiv macht. –

Antwort

0

Sie versuchen, alles von der übergeordneten Vorlage statt von der einzelnen Artikelvorlage zu steuern. Wenn Sie den Countdown-Timer auf der unteren Ebene studentViewTeamPaper Vorlage definieren, dann erhalten Sie automatisch einen anderen Timer für jeden.

Schauen Sie sich auch die remcoder:chronos-Paket, die Zeit reagiert.

Verwandte Themen