Angular 2 Reset Observable Timer - PullRequest
Новая
       7

Angular 2 Reset Observable Timer

0 голосов
/ 29 мая 2018

У меня есть служба, в которой у меня метод вызывается каждые 30 секунд автоматически.У меня также есть кнопка, которая позволит пользователю сбросить таймер, предотвращая вызов этого метода в течение еще 30 секунд.Как я могу сбросить таймер, чтобы этот метод не вызывался в течение этих 30 секунд, если нажата кнопка?

КОМПОНЕНТ 

constructor(private service: Service) {
  this.service.initialize();
}

refreshTimer(): void {
  this.service.refreshTimer();
}

СЕРВИС 

initialize(): void {
    timer(0, 30000).subscribe(() => this.refresh());
}

refreshTimer(): void {
  // Need help here
}

Как вы можете видеть, мой компонент вызывает initialize () из своего конструктора, который инициализирует таймер для запуска this.refresh () каждые 30 секунд.Идея состоит в том, что мой html будет вызывать refreshTimer () в компоненте, который в конечном счете вызовет refreshTimer () в сервисе, чтобы снова запустить таймер.Как я могу это сделать?

Заранее спасибо!

Ответы [ 2 ]

0 голосов
/ 29 мая 2018

Я бы использовал switchMap, который отписывается от предыдущего timer и подписывается на новый, который начинается заново. 

private reset$ = new Subject();

initialize(): void {
  this.reset$
    .pipe(
      startWith(void 0),
      switchMap(() => timer(0, 30000)),
    )
    .subscribe(() => this.refresh());
}

refreshTimer(): void {
  this.reset$.next(void 0);
}

Оператор startWith необходим для запуска создания первогоtimer при подписке.

0 голосов
/ 29 мая 2018

Вы должны отписаться, а затем повторно подписаться на наблюдаемый таймер 

t = timer(0, 30000);
sub: Subscription;

initialize(): void {
    this.sub = this.t.subscribe(() => this.refresh());
}

refreshTimer(): void {
    this.sub.unsubscribe();
    this.initialize();
}

, или вы можете просто выбрать один метод 

t = timer(0, 30000);
sub: Subscription;

initTimer(): void {
    this.sub && this.sub.unsubscribe();
    this.sub = this.t.subscribe(() => this.refresh());
}
...