我可以在指令中看到控制器范围属性吗？

Question

假设这只手表位于指令内，可以像这样从主控制器观察变量吗？这是整个指令。当它看起来像这样，手表确实会在首页加载时触发，但不会再次触发。我不会将questionNumber传递给指令。这是为什么它不知道它？

.directive('videoLoader', function() { 
return function (scope, element, attrs) { 
    scope.$watch(attrs.videoLoader, function() { 
     element[0].load(); 
     element[0].play(); 
     $(scope.video).bind('ended', function() { 
      $(this).unbind('ended'); 
      if (!this.ended) { 
       return; 
      } 
      scope.tutorialNumber++; 
      scope.$apply(); 
      scope.loadFromMenu(); 
     }); 
    }); 
    scope.$watch(scope.questionNumber, function(){ 
     if (scope.sectionNumber === 0 && scope.tutorialNumber === 0) { //if first video play congratulations etc 
      if (scope.questionNumber === 1) { 
       start(164.15); 
       pause(166.8); 
      } else if (scope.questionNumber === 2) { 
       start(167.1); 
       pause(170); 
      } else if (scope.questionNumber === 3) { 
       start(171.1); 
      } 
     } 
    }); 
} 

}）

Answer 1

因为你的指令，也没有创造新的范围内，或者隔离范围，它使用的是范围影响HTML中使用指令的地方。如果controls是一个指令，并且它创建一个新的或隔离范围，那么video-loader指令也将使用该范围。这也许可以解释为什么@ rajkamal的答案不适合你。

如果controls不是指令，那么视频加载器将使用控制器的作用域（除非在ng-repeat或创建子作用域的其他指令中有视频加载程序。）不向我们展示更多HTML ，不可能确定您的指令的范围。

这里是a plunker显示了在控制器范围内使用的视频加载器指令如何访问该范围（特别是questionNumber属性）。

虽然可能需要一些时间才能习惯jsfiddle和plunker，但我强烈建议花时间。如果你有jsfiddle或plunker，人们可以更快地帮助你。

Answer 2

scope.$watch('questionNumber', function(newValue, oldValue){//something}。在发布之前，我没有尝试过一个例子，但我记得以前这样尝试过。

请注意，scope.$watch(scope.questionNumber...现在scope.$watch('questionNumber'...

Answer 3

哈利路亚我已经做到了！答案是否定的，显然指令不能看到其他控制器的作用域，它们必须通过HTML中的属性传递，这只需要一个属性即可，但我一直在努力获取2，结果可能是这样

<video video-loader class="video-js vjs-default-skin" id="myvideo" congrats="questionNumber" video-loader="tutorialNumber" id="video" controls> 
    <source type="video/mp4" src="{{videoURLs[tutorialNumber]}}.mp4"></source> 
    <source type="video/webm" src="{{videoURLs[tutorialNumber]}}.webm"></source> 
    Your browser does not support the video tag. 
</video> 

然后指令内访问与第二$手表，像这样做：

directive('videoLoader', function() { 
    return function (scope, element, attrs) { 
     scope.$watch(attrs.videoLoader, function() { 
      element[0].load(); 
      element[0].play(); 
      $(scope.video).bind('ended', function() { 
       $(this).unbind('ended'); 
       if (!this.ended) { 
        return; 
       } 
       scope.tutorialNumber++; 
       scope.$apply(); 
       scope.loadFromMenu(); 
      }); 
     }); 
     scope.$watch(attrs.congrats, function(){  
      scope.questionNumber; 
      if (scope.sectionNumber === 0 && scope.tutorialNumber === 0) { //if first video play congratulations etc 
       if (scope.questionNumber === 1) { 
        start(164.15); 
        pause(166.8); 
       } else if (scope.questionNumber === 2) { 
        start(167.1); 
        pause(170); 
       } else if (scope.questionNumber === 3) { 
        start(171.1); 
       } 
      } 
     }); 
    }; 
})