Angular, how to react to a window resize event

Question

In a non angular application we can respond to window resize events with the following:

  window.onresize = function(event) {
    console.log('changed');
  };

However we can't use this in angular applications since it's a bad practice to directly access the window object. How would we implement the above functionality in the 'angular' way?

https://stackoverflow.com/questions/35527456/angular-window-resize-event — Oleksandr Poshtaruk, Feb 25 '18 at 20:00

score 6 · Answer 1 · answered Feb 25 '18 at 20:11

6

For anyone who is interested:

  @HostListener('window:resize', ['$event']) onResize(event) {
     console.log(event.target.innerWidth;);
  }

Credits to: Angular window resize event

answered Feb 25 '18 at 20:11

Willem van der Veen

33,665
16
190
155

But this will call the listener dozens of times. A throttle function is needed. – dude Apr 24 '20 at 13:59

Angular, how to react to a window resize event

1 Answers1