文章/答案/技术大牛

发布

社区首页 >问答首页 >使用AngularJS播放和暂停HTML5视频/音频播放器控件

问使用AngularJS播放和暂停HTML5视频/音频播放器控件
EN

Stack Overflow用户

提问于 2015-06-18 02:18:39

回答 2查看 27.9K关注 0票数 4

我想用AngularJS控制HTML5音视频播放器。我想播放和暂停那个玩家。我可以使用jQuery做到这一点。但我需要它和AngularJS一起工作。

html

javascript

jquery

angularjs

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-06-18 02:34:02

https://github.com/2fdevs/videogular
creating您自己的自定义指令可以为您完成这项工作(首选和可重用)，

最简单的方法是使用angular.element，并使用其功能从DOM中选择所需的视频元素。

//控制器

function myCtrl($scope) { $scope.url =“视频或音频的url”$scope.pauseOrPlay = function(ele){ var = angular.element(ele.srcElement)；video.pause()；// video.play() } }

有关angular.element https://docs.angularjs.org/api/ng/function/angular.element的更多信息

票数 7

Stack Overflow用户

发布于 2015-06-18 02:34:03

我希望这对你有用(适当地更改域名和文件名)

 <!DOCTYPE html> 
    <html>
    <head>
    <title>Video  Demo </title> 
    </head>

    <body>

    <video id="video" controls> 
        <source src=http://your_domain_source/video.webm type=video/webm> 
        <source src=http://your_domani_source/video-canvas-magic/video.ogg type=video/ogg> 
        <source src=http://your_domain_source/demos/video-canvas-magic/video.mp4 type=video/mp4> 
    </video> 
    <p>controls :</p>
    <button onclick="playVideo();" style="cursor: pointer;">Play</button>

    <button onclick="pauseVideo();" style="cursor: pointer;">Pause</button>

    <button onclick="rewindVideo();" style="cursor: pointer;">
      Back to beginning</button>
      <script>
        video = document.querySelector("#vid");

    function playVideo() {
      video.play();
    }
    function pauseVideo() {
      video.pause();
    }

    function rewindVideo() {
      video.currentTime = 0;
    }
    </script>
    </body>
    </html>

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/30899331

复制

相似问题

问使用AngularJS播放和暂停HTML5视频/音频播放器控件
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用AngularJS播放和暂停HTML5视频/音频播放器控件EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用AngularJS播放和暂停HTML5视频/音频播放器控件
EN