0

该指令应该监视 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();
                });
            });
        });
    }
});
4

2 回答 2

1

你应该把你的 $watch 表达式写成:

scope.$watch('tutorialNumber', function(){ ...

或者

scope.$watch(function(){return scope.tutorialNumber;}, function(){ ...
于 2013-03-01T15:14:00.450 回答
0

我读错了,还是您的范围参考写错了?

scope在大多数情况下都列出了,但常见的 Angular 参考是$scope.

此外,还有这样的事情$rootScope。您可以利用$rootScope将值返回给应用程序(模型)的父级,然后利用指令或模块中的 $scope 来划分数据。

于 2014-07-11T19:08:05.427 回答