How to trigger window resize on width changes only

  angular, resize, typescript

I need to apply some custom styling on an element based on the window’s current screenWidth.

That’s successfully done by using the following @HostListener:

 @HostListener('window:resize', ['$event'])
  public resize() {

   // apply styles here depending on current window.innerWidth...


However, I want to trigger the resize method ONLY when window’s width has changed and do nothing when height has changed.

The way it is so far, the resize method is also called if the user changes the window height and that is breaking my styling logic!

So my question is: Is there a way in Angular to make something like (‘window:resizeX’) in order to call resize() only when window width changes, ignoring changes on window height?

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.