javascripthtmlangularjsvideovideogular

Videogular fails to play video

I have dynamically binded the video src tag using angular.But videogular fails to append the video url.

Below is my videogular tag with angular bind expression where it binds video url dynamically.

<vg-media 
vg-src='[{src: "{{selectedVideo.Uris[0].AbsolutePath}}", type:   "video/mp4"}]'
vg-loop="controller.config.plugins.controls.loop"
vg-preload="controller.config.plugins.controls.preload">
</vg-media>

But you can see in the Image below.When page is running the video src is binded to the videogular-src tag but not to the video tag.Angular binding expression is showing.Videogular fails to play video.

enter image description here

How to make it play. Need help!

Solution

  • Video URL must be trusted by AngularJS $sce provider.

    In your controller:

    this.getVideo = function(){
    {
        src: $sce.trustAsResourceUrl("http://static.videogular.com/assets/videos/videogular.mp4"),
        type: "video/mp4"
    }
};

    In your vg-media tag:

    <vg-media vg-src="ctrl.getVideo()">