VG-Controls not responding on Angular 5

[Haugf]

Description

Hello Everyone, I have a single page video player application. The application loads the videos but when I press any of the buttons, other than the full screen button, nothing happens.

Expected Behavior

The control html tags should respond. When I created the application with iframe the videos were playing.

Actual Behavior

The controls do nothing when clicked.

Steps to Reproduce

I have added the vg-player and nested vg-controls and vg-play-pause as well as the full screen tag.
I added a video tag that looks like this
<video [vgMedia]="media" [src]="currentItem.url" type="video/mp4" id="singleVideo"> </video>
after the vg-control

Attachments

Try to include screenshots for bugs or design assets for enhancements

Image One

| The top of my app.component.html file |

Image Two

| My app.component.ts file |