Javascript angularJS 2中的倒计时功能

我需要一个秒表定时器功能写在angular2为我的在线考试申请。 它应该以HH:MM:SS格式显示。

---

它应该从01:00:00开始，到00:00:00结束。您可以这样做：

@组件({
选择器：“我的应用程序”，
模板：`
你好{{name}
{{开始？'reset'：'start'}


{{time.getHours（）}}：
{{time.getMinutes（）}}：
{{time.getSeconds（）}}
`,
})
导出类应用程序{
名称：字符串；
开始=错误；
时间=新日期（2000,1,1,1,0,0）；
构造函数（）{
this.name='Angular2'
这个；
}
private_timerTick（）{
如果（此.started）{
this.time.setSeconds（this.time.getSeconds（），-1）；
}
setTimeout（（）=>this.\u timerTick（），1000）；
}
按钮点击（）{
如果（this.start）this.reset（）；
否则，请执行以下操作：start（）；
}
开始（）{
this.started=true；
}
重置（）{
this.start=false；
this.time=新日期（2000,1,1,1,0,0）；
}
}

现场演示：

但是，像往常一样，实现目标有多种方法！：）

Html元素按钮，该按钮上的倒计时计时器函数 触发

---

用js创建并将在angular2中工作。你被卡在哪里了？帮我找到angular2中秒表计时器的方法。像这样的问题应该被禁止。Gurudath显然没有付出任何努力，在考试中作弊。您在哪里单击“接受用于考试作弊的用户的答案”？

<div class="form-group col-sm-3" [ngClass]="{'red':activate, 'white':!activate, 'blink_me':blink}"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;Time Left:&nbsp;<span>{{currentHour}}:{{currentMinute}}:{{currentSeconds}}</span></div>
<button class="btn btn-primary btn-sm" (click)="_timerTick()">Start Timer</button>

constructor(
    private examService: ExamService,
    private resultService: ResultService,
    private activatedRoute: ActivatedRoute,
    private route: Router) {

        this.start(); //here our countdown timer function gets called by setting the boolean variable **this.started** as true.
}

start() {
    this.started = true;
}

private _timerTick() {
    if (this.started) {

        if (localStorage.getItem('sec')) { // here it checks, if browser local-storage has key **sec** recorded. Basically, when browser gets refreshed by user on that case it used to store key **sec** in local-storage and continue countdown ticking without starting from the beginning.
            this.time = new Date(localStorage.getItem('sec'));
            this.time.setSeconds(this.time.getSeconds(), -1);
        }
        else {
            this.time = new Date(2017, 2, 24, 0, 0, this.timeInSeconds);
            this.time.setSeconds(this.time.getSeconds(), -1);
        }
        if (this.time.getHours() === 0 && this.time.getMinutes() === 0 && this.time.getSeconds() === 0) {
            localStorage.removeItem('sec');
            this.started = false;
            this.saveData('Time Over!');
        }
        this.currentHour = this.time.getHours();
        this.currentHour = ("0" + this.currentHour).slice(-2); //Here it check for two digits. If it is single then it adds 0 as prefix to it.
        this.currentMinute = this.time.getMinutes();
        this.currentMinute = ("0" + this.currentMinute).slice(-2);//Here it check for two digits. If it is single then it adds 0 as prefix to it.
        this.currentSeconds = this.time.getSeconds();
        this.currentSeconds = ("0" + this.currentSeconds).slice(-2);//Here it check for two digits. If it is single then it adds 0 as prefix to it.
        if (this.currentHour == 0 && this.currentMinute < 5) {// This line states, if only 5minutes left out then timer get started blinking. Blink code given in below **css** code section
            this.activate = true;
            this.blink = true;
        }
        if (this.currentHour == 0 && this.currentMinute == 0 && this.currentSeconds == 0) {// If time is up then we would remove complete browser cache using below lines of code and also deactivate the timer blinking.
            localStorage.removeItem('sec');
            localStorage.setItem('examTaken', this.name);
            this.activate = false;
            this.blink = false;
        }
        else {
            localStorage.setItem('sec', this.time);// If still some time's left out then it'll continuously keep updated with browser localStorage
        }
    }
    setTimeout(() => this._timerTick(), 1000);// For every 1sec timer gets updated here
}

.blink_me {
    animation: blinker 1s linear infinite;
}
@keyframes blinker {
    50% {
        opacity: 0;
    }
}
.white {
    color: white;
}
.red {
    color: #ff0000;
}