在屏幕上播放和暂停html5视频,点击角度js

时间:2016-05-10 07:45:30

标签: javascript angularjs html5 html5-video

我在我的角度js应用程序中播放html5视频。我希望视频能够在单击视频屏幕时暂停和播放。我已经能够使用一个功能来暂停或播放它,我希望能够做到这两点取决于视频是暂停还是正在播放。我尝试过pausePlay()函数,但它不起作用。我的代码如下所示:

HTML

<video style="width:100% !important; height:auto !important;" controls ng-click="video($event)" src="{{feeditem.feed[0].url | trustUrl}}"  type="video/mp4">

控制器中的功能

$scope.video = function(e) {
var videoElements = angular.element(e.srcElement);
videoElements[0].pause();
}

1 个答案:

答案 0 :(得分:2)

尝试以下方法:

$scope.pauseOrPlay = function (ele) {
    var video = angular.element(ele.srcElement)[0];
    if (video.paused) {
        video.play();
    } else {
        video.pause();
    }
};

您还可以显示/隐藏控件:

$scope.pauseOrPlay = function (ele) {
    var video = angular.element(ele.srcElement)[0];
    if (video.paused) {
        video.play();
        video.controls="controls";
        video.setAttribute("controls","controls")
    } else {
        video.pause();
        video.removeAttribute("controls")
    }
};