1

I am opening a video file using input type file. Following is the function that is being called and file is being sent here.

function fetchVideo(file) {
    if(file) {
        var reader = new FileReader();
        reader.onload = function(e) {
            layoutVM.video = e.target.result;             
        }
        reader.readAsDataURL(file);
    }
}

The html for this is 

<video loop muted autoplay>
     <source ng-src="{{layoutVM.video}}" type="video/mp4">
</video>

After FileReader works, e.target.result gets a long string starting from "data:video/mp4;base64,AAAAIGZ0eXBpc29tAAACA .................................. "

The video is not being loaded in source, any idea?

Umair Jameel
  • 1,573
  • 3
  • 29
  • 54

1 Answers1

0

haven't tested though but can you try to create object URL from file instead of using reader?

function fetchVideo(file) {
    if(file) {
        layoutVM.video = URL.createObjectURL(file);             
    }
}
Theo
  • 1,932
  • 4
  • 17
  • 40
  • oh, that's a pain. can you also try to add `layoutVM.$apply();`? https://stackoverflow.com/questions/18754943/preview-image-before-uploading-angularjs#answer-31952876 – Theo Mar 02 '18 at 14:11