質問

Angular 5を使用しています。

再生」ボタンが押されたときに、クリックしてからどのくらい時間が経過したかを知るために、どのようにタイミングを開始することができるか知りたいです。

また、タイマーを止めても、以前と同じ時間で続けられるかどうかも知りたいです。

Pardeep Jainの回答でやっと疑問が解けました。しかし、それは私が探していたものではありませんでした。 私はカウントダウンを望んでいたのではなく、持続時間を数えたかったのです。以下は、私が最後に使用したコードです。

time: number = 0;
interval;

startTimer() {
  this.play = true;
  this.interval = setInterval(() => {
    this.time++;
  },1000)
}

pauseTimer() {
  this.play = false;
  clearInterval(this.interval);
}

解決方法は？

単純に setInterval このようなタイマーをAngularで作成するには、次のコードを使用します。

timeLeft: number = 60;
  interval;

startTimer() {
    this.interval = setInterval(() => {
      if(this.timeLeft > 0) {
        this.timeLeft--;
      } else {
        this.timeLeft = 60;
      }
    },1000)
  }

  pauseTimer() {
    clearInterval(this.interval);
  }

<button (click)='startTimer()'>Start Timer</button>
<button (click)='pauseTimer()'>Pause</button>

<p>{{timeLeft}} Seconds Left....</p>

作業例

また、以下のようにObservableタイマーを使用する方法もあります。

import { timer } from 'rxjs';

observableTimer() {
    const source = timer(1000, 2000);
    const abc = source.subscribe(val => {
      console.log(val, '-');
      this.subscribeTimer = this.timeLeft - val;
    });
  }

<p (click)="observableTimer()">Start Observable timer</p> {{subscribeTimer}}

作業例

詳しくはこちら こちらをご覧ください