Multiple countdown timers in one page


#1

hi,
I have created my custom countdown timer. but I need to call that timer multiple times.

page.HTML
<ion-item lines=“full” *ngFor=“let session of liveReminderData”>

<span *ngIf="!session.status" class=“live”>Live
<img [src]=“session.sessionImg != null ? session.sessionImg : ‘assets/img/001.jpg’” />


Start’s in: {{countdowntimer(session.duration)}}

    </ion-label>
    <ion-button [disabled]="session.status" slot="end" color="secondary" class="join" (click)="goLive(session);">Join Now</ion-button>
    
  </ion-item>

page.ts::

seconds;
minutes;
hours;
clockDisplay: string;
interval: number;
countdowntimer(duration) {
if (duration > 0) {
setInterval(() => {
duration = duration - 1;
if (duration <= 0) {
return;
}
if (duration % 60 < 10) {
this.seconds = “0” + parseInt("" + duration % 60);
} else {
this.seconds = “” + parseInt((duration % 60).toString());
}
if (duration / 60 < 10) {
this.minutes = “0” + parseInt("" + duration / 60, 10);
} else {
this.minutes = “” + parseInt((duration / 60).toString(), 10);
}

    if (duration / 3600 < 10) {
      this.hours = "" + parseInt("" + duration / 3600);
    } else {
      this.hours = "" + parseInt((duration / 3600).toString())
    }
    if (this.minutes >= 60) {
      this.minutes = parseInt("" + this.minutes % 60);
    }
   this.clockDisplay =this.hours+ "h:" + this.minutes + "m:" + this.seconds + "s";
    if (this.hours == 0 && this.minutes == 0 && this.seconds == 1) {
    //write ur code........

}
}, 1000);
}
}

in page for every for each item, we need diff timer…like DREAM 11 application