我有一个项目,我在 View 中嵌入了一个 html5 视频。

我使用 $scope 动态填充源。

我填充播放器的初始视频工作正常。

在视频结束时,我尝试将视频的 src 更改为下一个剪辑,直到它结束。

我的问题是视频 src 没有更新,只播放初始剪辑。

这是 html(非常简单):

<video style="width:100%; height:100%; padding:0;" class="embed-responsive embed-responsive-16by9" id="myVideo" controls> 
    <source ng-src="{{currentVideo}}" type="video/mp4"> 
</video> 

这是实现 Controller 更改的代码:

if (videoId.currentTime >= videoId.duration - 1) { 
    // $state.go('unit_1'); 
 
    $scope.currentVideo = myObj.units[1].lessonUrl; //set video 
    videoId.play(); 
} 

仅供引用 - videoId 是视频的变量。它工作正常,因为我可以播放 ()、暂停 ()、获取当前时间等。

所以我知道我正在控制播放器并且我正在成功加载初始视频。

我假设当 $scope 发生变化时,新的视频 URL 会发生变化,但显然我错了。

有什么想法吗?

谢谢!

请您参考如下方法:

如果你想改变视频的 src <source>元素,你需要调用videoId.load(); 之前 videoId.play();否则只需直接更改视频元素本身的 src 属性——这样就不需要加载:

<video ng-src="{{currentVideo}}" style="width:100%; height:100%; padding:0;" class="embed-responsive embed-responsive-16by9" id="myVideo" controls> 
</video> 


评论关闭
IT序号网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!