Using Vidyard embedded player inside of Angular

The embed code provided from the Vidyard Portal is like below:

<!-- The script tag should live in the head of your page if at all possible -->
<script src="https://play.vidyard.com/embed/v4.js" type="text/javascript" async></script>
<!-- Put this wherever you would like your player to appear -->
<img
  style="max-width: 100%;"
  class="vidyard-player-embed"
  src="https://play.vidyard.com/Cse5Fqy1CpUWqYdtikKrFy.jpg"
  data-uuid="Cse5Fqy1CpUWqYdtikKrFy"
  data-v="4"
  data-type="inline"
/>

I need to integrate this in Angular (2 & above) which is in typescript. I tried few ways, I can see only image rather than video. If someone can help out, it would be great!!

I was able to get this to work in my own solution after some time. I created a vidyard stand alone component like this:

import { Component, Input } from '@angular/core';
import 'zone.js';
import VidyardEmbed from '@vidyard/embed-code';

@Component({
  selector: 'vidyard-widget',
  standalone: true,
  template: `
    <img
      id="todos-video"
      style="width: 100%; margin: auto; display: block; max-width: 350px; max-height: 350px;"
      class="vidyard-player-embed"
      src="https://play.vidyard.com/{{ videoId }}.jpg"
      [attr.data-uuid]="videoId"
      data-v="4"
      [attr.data-type]="videoType" />
  `,
})
export class VidyardComponent {
  @Input() videoId: string;
  @Input() videoType: string;

  constructor() {
    Zone.current
      .fork({
        name: 'VidyardComponent',
        onHandleError: (parentZoneDelegate, currentZone, targetZone, error) => {
          console.error('Error in VidyardComponent', error);
          return false;
        },
      })
      .run(() => {
        const script = document.createElement('script');
        script.src = 'https://play.vidyard.com/embed/v4.js';
        script.async = true;
        script.onload = () => {
          const vidyard = new VidyardEmbed('todos-video');
          vidyard.on('ready', () => {
            vidyard.play();
          });
        };
        document.body.appendChild(script);
      });
  }
}

At that point I was able to just add it to any component like this:

<vidyard-widget [videoId]="'UUID'" [videoType]="'video-type'"></vidyard-widget>

What I found is that if you just use the snippets provided directly from vidyard, Angular blocks the dom manipulation. But dynamically injecting the script and running it via zone and running it works every time.