关于如何将音频元素绑定(bind)到 ng-model 有什么想法吗？
我想用音频元素的播放值更新一个 div 吗？
<audio ng-model="myAudio">...</audio>
<div>{{myAudio.timeElapsed}}</div>
或者类似的东西。知道怎么做吗？
最佳答案
您可以通过为您的应用创建自定义指令来实现这一点。该指令将函数绑定(bind)到音频元素的 timeupdate 事件。绑定(bind)函数更新当前范围的 timeElapsed 属性并调用 $apply 将更改传播到 View 。您可以在以下位置查看示例:
HTML
<body ng-app="audio" ng-controller="TestAudioCtrl">
<audio controls my-audio>
<source src="**YOUR SOURCE FILE**"></source>
</audio>
<div>Elapsed: {{timeElapsed}}</div>
</body>
Javascript
angular.module("audio", [])
.directive("myAudio", function(){
return function(scope, element, attrs){
element.bind("timeupdate", function(){
scope.timeElapsed = element[0].currentTime;
scope.$apply();
});
}
});
TestAudioCtrl = function($scope){
$scope.timeElapsed = 0;
}
关于angularjs - AngularJS 中 html5 音频元素的 ng-model，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17257435/