How to dynamically update Angular2 screen size?

Question

JavaScript

I have an animation that goes on the screen for 2 seconds. But when the screen size is small, then these 2 seconds of animation do not look very nice. I would like to somehow adjust this interval depending on the size of the browser window and, moreover, dynamically. Suddenly a person turns the device upside down, the size of the browser is not the same.
Are there ways to dynamically listen to screen data, or are there other ways to solve the problem?
My streaming attempts:

size = Observable.create((observer) => {
      observer.next(window.screen.availWidth)

  })

constructor(private size: ScreenSizeService ) { }
this.size.size.subscribe(data => { console.log(data)});

Answer 1

What about the standard way? example