angular播放html5视频,HTML5视频/音频播放器控件使用AngularJS播放和暂停(HTML5 video/audio player control play & pause with ...
HTML5视频/音频播放器控件使用AngularJS播放和暂停(HTML5 video/audio player control play & pause with AngularJS)
我想用AngularJS控制HTML5音频/视频播放器。 我想玩和暂停那个玩家。 我可以使用jQuery来做到这一点。 但我需要它与AngularJS合作。
I want to control HTML5 audio/video player with AngularJS. I want to play & pause that player. I can do this using jQuery. But I need it to work with AngularJS.
原文：https://stackoverflow.com/questions/30899331
更新时间：2020-01-24 23:59
最满意答案
创建自己的自定义指令可以为您完成工作(首选和可重用)，
最简单的方法是使用angular.element并使用其功能从DOM中选择所需的视频元素。
//控制器function myCtrl($scope) {
$scope.url = "url of video or audio"
$scope.pauseOrPlay = function(ele){
var video = angular.element(ele.srcElement);
video[0].pause(); // video.play()
}
}
creating your own custom directive can does the job for you (Preferred and reusable),
The simplest way is using angular.element and selecting the required video element from the DOM using its functionalities.
//controller function myCtrl($scope) {
$scope.url = "url of video or audio"
$scope.pauseOrPlay = function(ele){
var video = angular.element(ele.srcElement);
video[0].pause(); // video.play()
}
}
相关问答
嗯，我不是100％肯定，但我不认为jQuery扩展/解析这些函数和属性( .paused ， .pause() .play() )。 尝试访问DOM元素，如： $('.player_audio').click(function() {
if (this.paused == false) {
this.pause();
alert('music paused');
} else {
this.play();
alert('music playi
...
这是您的javascript的更改： $(window).keypress(function(e) {
var video = document.getElementById("vid");
if (e.which == 32) {
if (video.paused)
video.play();
else
video.pause();
}
}); Here's the changes to your javascript: $(w
...
我已经构建了一个由flash支持播放音乐的html播放器，因此构建我自己的事件流程以进行操作，但我认为最好的方法是编写一个指令来执行此操作。 在这种情况下，如果需要，您可以重复使用该指令，并且它可以很好地工作。 如果您将播放器对象放入指令中，则可以正常捕获所有事件。 看一下这个网站： Angular Tunes并查看来源以了解他的工作。 它和你想做的一样。 我希望它有所帮助。 I've build a html player backended by flash to play music, so
...
设置src属性后，调用video.load() 。 实际上，如果你只有一个单一来源(大概是因为你知道你将使用一个可以播放mp3的浏览器)，那么你可以简单地设置视频标签本身的src属性。 HTML：
使用Javascript
...
这是W3C for HTML5视频的演示/测试页面，但我相信音频的相关事件应该与音频相同http://www.w3.org/2010/05/video/mediaevents.html 所以你可以做一些事情： $('audioplayer').on('pause', function() {
if (playerStream.paused) {
playerStream.play();
$('button.toggle-stream').attr('data
...
https://github.com/2fdevs/videogular 创建自己的自定义指令可以为您完成工作(首选和可重用)， 最简单的方法是使用angular.element并使用其功能从DOM中选择所需的视频元素。
//控制器 function
...
你有几个问题： playPause仅在加载页面后定义，但您之前尝试绑定它。 您可以删除$(document).ready()以在绑定之前定义函数。 document.getElementById("video")返回undefined (除非你的帖子中是拼写错误)，因为你的元素有id video1 这是一个有效的代码：
$(".sMusicPlyaer")
...