在角度控制器中捕获HTML5视频事件

Question

<video id="video-player" ng-click="togglePlayer($event)" 
       oncontextmenu="return false" autoplay="true" loop 
       class="composition-video" ng-src="{{url}}" type="video/mp4"></video>

当angularjs控制器中的视频播放器状态更改时，如何捕获事件？

Answer 1

这是使用伪指令的一种可能方法，该伪指令将侦听器添加到您的视频元素中：

http://plnkr.co/edit/dOm5TnGiSkJAUAtXSFa1?p=preview

.directive('videoEvents', function () {
    return function ($scope, $element) {
      $element[0].addEventListener("loadeddata", function () {
        console.log('loadeddata');
        // you can $rootScope.$broadcast...
      });
      $element[0].addEventListener("playing", function () {
        console.log('playing');
        // you can $rootScope.$broadcast...
      });
      // and so on...
    }
});