title: Angular 8 - Is there a way to bind to a video element to determine when it is loaded/starts playing?
body: <p>Given:</p>
  <pre><code>&lt;video poster=&quot;assets/videos/poster.png&quot;
         #videoPlayer 
         onloadedmetadata=&quot;this.muted = true&quot;&gt;
       &lt;source src=&quot;assets/videos/video.mp4&quot; type=&quot;video/mp4&quot;&gt;
  &lt;/video&gt;
  </code></pre>
  <p>And in Angular:</p>
  <pre><code>...
  
  public videoLoaded: boolean = false;
  
  ...
  </code></pre>
  <p>How can I bind videoLoaded to update once the video starts playing? (or is loaded) I've looked online and saw some older jquery implementations that seem to not be working in newer versions of chrome and want to know the latest way on how to accomplish this</p>
  <p>Thanks</p>