有关于在angular框架的项目中使用video.js作为视频播放插件的问题（在线等

Question

现在所处的项目是使用angular作为项目框架，video.js作为视频预览的插件，但是在使用video.js的话，无法在video的src中使用双向绑定，会报错No compatible source was found for this media.
把src改成ng-src以及使用$sce来通过安全检查都尝试过了，都不行。

在我将controller中的video.js的基本配置去掉之后就可以播放了，但是却是video标签的效果，就跟没有使用video.js这个插件一样。

这个是页面中的报错信息

希望有大佬可以给我指个方向
js代码

// video.js插件配置
    videojs("Sx-video", {}, function () {
        var myPlayer = videojs('Sx-video');
        videojs("Sx-video").ready(function () {
            var myPlayer = this;
            var howLongIsThis = myPlayer.duration();//视频时长
        });
    });

html代码

<video id="Sx-video" class="Sx-sixVideo video-js vjs-big-play-centered" controls preload="auto" poster="" data-setup='{}'>
                    <source ng-src="{{vm.form.url|urlSce}}" type='video/mp4'>
</video>

urlSce过滤器代码

angular.module('myApp').filter('urlSce', function ($sce) {
    return function (url) {
        return $sce.trustAsResourceUrl(url)
    }
})

目前页面显示效果

Answer 1

不要写video标签，写成自定义指令试试