问题
I want to create a countdown timer which has 4 fields hours:minutes:seconds:milliseconds. I've gone through the following links before I posted this question.I don't know why should we have a hardcoded date and then subtract something from it. I'm not able to get the concept of Observable here.
Time CountDown in angular 2
Angular 2 - Countdown timer
Can someone please help me?
This is what I've written from https://stackoverflow.com/a/40784539/4579897
private eventDate: Date = new Date(2018, 1, 15);
private diff: number;
private countDownResult: number;
private days: number;
private hours: number;
private minutes: number;
private seconds: number;
constructor(public navCtrl: NavController, public navParams: NavParams,elm: ElementRef) {
Observable.interval(1000).map((x) => {
this.diff = Math.floor((this.eventDate.getTime() - new Date().getTime()) / 1000);
}).subscribe((x) => {
this.days = this.getDays(this.diff);
this.hours = this.getHours(this.diff);
this.minutes = this.getMinutes(this.diff);
this.seconds = this.getSeconds(this.diff);
});
}
getDays(t){
var days;
days = Math.floor(t / 86400);
return days;
}
getHours(t){
var days, hours;
days = Math.floor(t / 86400);
t -= days * 86400;
hours = Math.floor(t / 3600) % 24;
return hours;
}
getMinutes(t){
var days, hours, minutes;
days = Math.floor(t / 86400);
t -= days * 86400;
hours = Math.floor(t / 3600) % 24;
t -= hours * 3600;
minutes = Math.floor(t / 60) % 60;
return minutes;
}
getSeconds(t){
var days, hours, minutes, seconds;
days = Math.floor(t / 86400);
t -= days * 86400;
hours = Math.floor(t / 3600) % 24;
t -= hours * 3600;
minutes = Math.floor(t / 60) % 60;
t -= minutes * 60;
seconds = t % 60;
return seconds;
}
But this has "day" in it which I don't want.I want milliseconds instead and also if someone can explain me what does
Observable.interval(1000).map((x) => {
this.diff = Math.floor((this.eventDate.getTime() - new Date().getTime()) / 1000);
})
mean ? I want to know what should be the code in the html page. Thanks in advance !!
来源:https://stackoverflow.com/questions/44545167/angular2-ionic2-how-to-create-a-countdown-timer-with-hours-mins-secs-and-millis