Problem during playing pre captured local video by using html5 video src attribute programatically

I believe it is a problem about angular (because I am a newbie for it and probably don’t know the reason).

I have an application to capture video, audio and picture and save them to the FileSystem then store the location on sqlite db. Audio and Image part is already done but having problem on video part.

I am using the code below to get the location of the url from the control (where it is being collected from the db) and write it to the source of the video; unfortunately it is not working.

  <video autoplay controls type="video/quicktime">
      <source src="{{video.url}}">
  </video>

But when I put an alert and get the url coming from the db and type it by hand to the src, it is working

  <video autoplay controls type="video/quicktime">
      <source src="file:///var/mobile/Applications/ED83697E-0D44-4EB9-AB05-8FFF90DF8B88/Documents/5113_capturedvideo.MOV">
  </video>

So I believe, the render happens before src get the value. Do someone know how can I get over it?

Thanks!

I’ve solved my problem by the code below:

    var video = document.getElementById('video');
	var source = document.getElementById('source');
	source.setAttribute("src", $scope.video.url);
    video.load();

I tried your example, but not work for me. Did you have one full example ? I need to get event done in video on IOS, do you know how can I do this ?

Have you tried using ng-src instead of src ?

Have a look at this custom directive : http://twofuckingdevelopers.com/2014/04/angularjs-video-source-directive/