カテゴリー
【Angular活用講座】Rxjs:repeatオペレーターで一定時間間隔の処理を行わせてみる
2022/05/11
2つのタイマー 〜 setIntervalと再帰setTimeoutの違いを知る
let timerId = setTimeout(function tick() {
//...定期実行したい処理を記述
timerId = setTimeout(tick, 1000);
}, 1000);

rpeatオペレーターで作るRxjs版の再帰setTimeoutタイマー
const { defer,repeat, share, Subject, takeUntil } = require('rxjs');
//...中略
private stopPolling = new Subject();
const source = defer(() => http.get('https://hoge.com/api'));
this.myInterval$ = source.pipe(
repeat({ delay: 5000 }),
share(),
takeUntil(this.stopPolling)
);
import { Injectable, OnDestroy } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, defer,repeat, share, Subject, takeUntil } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class HogeService implements OnDestroy {
private myInterval$: Observable<any>;
private stopNotifier = new Subject();
constructor(private http: HttpClient) {
this.myInterval$ = defer(() => http.get('https://hoge.com/api')).pipe(
repeat({ delay: 5000 }),
share(),
takeUntil(this.stopNotifier)
);
}
hogeInfo(): Observable<any> {
return this.myInterval$;
}
ngOnDestroy() {
this.stopNotifier.next(null);
}
}
参考サイト
記事を書いた人
ナンデモ系エンジニア
主にAngularでフロントエンド開発することが多いです。 開発環境はLinuxメインで進めているので、シェルコマンドも多用しております。 コツコツとプログラミングするのが好きな人間です。
カテゴリー