该指令应该监视 scope.tutorialNumber 变量的变化(随着用户学习教程的进行而增加),然后通过使用 tutorialNumber 作为数组 videoURLs 的索引来加载新视频,然后替换第一个硬编码的视频进入html。但是,当 tutorialNumber 更新时,$watch 似乎根本没有被触发。为什么?
<video data-setup="{'techOrder': ['html5', 'flash']}" class="video-js vjs-default-skin" id="myvideo" video-loader="tutorialNumber" id="video" controls>
<source type="video/mp4" src="file:///C:/Users/Dell/Desktop/grammar%20game/ㅗㅏregular.mp4"></source>
Your browser does not support the video tag.
</video>
.directive('videoLoader', function(){
return function (scope, element, attrs){
scope.$watch(scope.tutorialNumber, function(){
//element.load();
scope.video.src(scope.videoURLs[scope.tutorialNumber]);
scope.video.ready(function(){
scope.video.play();
$(scope.video).bind('ended', function(){
$(scope.video).unbind('ended');
if (!scope.video.ended) {
return;
}
scope.tutorialNumber++;
scope.$apply();
scope.loadFromMenu();
});
});
});
}
});