I am trying to follow the youtube player api documentation and am having difficult implementing it with Angular 4.
One of my components has a youtube video in which it needs to do various things to it such as start the video at a specific time, automatically pause, play etc. I know that I can load a youtube video and use the API inside a component's template directly like so:
<iframe
id="player"
type="text/html"
width="420"
height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k?autoplay=1&controls=1&disablekb=0"
frameborder="0">
</iframe>
but how would I have access to its state changes in the component's corresponding .ts file? Can I access the video within the typescript file by using the iframe's id value that I gave it?
I am also fine with using packages such as this one but the examples don't explain how to use it with components. I am sure that my issue is stemming from misunderstanding of how Angular 2+ works and I would appreciate any help.