sizeChanged: Subject<boolean>; sizeChangedDebounced; ngOnInit() { // show chart on init and size changes this.showChart(); this.sizeChanged = new Subject<boolean>(); this.sizeChangedDebounced = this.sizeChanged.pipe(debounce(() => interval(1000))); this.sizeChangedDebounced.subscribe(() => { this.showChart(); }); } showChart() { // do something } @HostListener('window:resize', ['$event']) onResize(event?) { this.sizeChanged.next(true); }
debounce example
import { fromEvent, interval } from 'rxjs'; import { debounce } from 'rxjs/operators'; const clicks = fromEvent(document, 'click'); const result = clicks.pipe(debounce(() => interval(1000))); result.subscribe(x => console.log(x));
References
https://rxjs-dev.firebaseapp.com/api/operators/debounce