Moodle for mobile

We had this problem in our app, we fixed it by using the $sce Angular service , which tell the app that this url or source is trustworthy thus you can use it anywhere in your app.

You can use it like this:

// In you controller:
$scope.srcList = [ 
          {src: $sce.trustAsResourceUrl(srouce one); type: 'video/mp4'},
          {src: $sce.trustAsResourceUrl(source two); type: 'video/flv'},
          {src: $sce.trustAsResourceUrl(source three); type: 'video/webm'} ]; // Assuming you have three sources.

Then you can use it in your view like this:

<video controls="controls" preload="none" >
     <!-- You can add the title in the list in your model -->
     <source ng-repeat="videoUrl in srcList" type="{{videoUrl.type}}" src="{{videoUrl.src}}" title="videoUrl.title">
     <!-- You apply the same thing to the sub-titles -->
</video>

You can also use 

ng-src="videoUrl.src"

If you have live video sources like .m3u8 you can use video.js library to create the player and use its hls plugin to fetch data from your live source.