vjs-video
vjs-video copied to clipboard
Published
20 hours ago •
LonnyGomes
LonnyGomes
vjsVideoMediaChanged doesn't fire
AngularJS 1.6 Video.js 5.14.1
I'm trying to reproduce the vjs-media="mediaToggle" example. The video plays successfully but I don't see the console message of the vjsVideoMediaChanged event.
How are you looking for the event? Are you doing something like the following?
scope.$on('vjsVideoMediaChanged', function (e) {
console.log(e);
});
I implemented it in the following way:
Controller:
angular.module('VideoChannelCtrl', [])
.controller('VideoChannelController', ['$scope', function($scope) {
$scope.mediaToggle = {
sources: [
{
src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',
type: 'video/mp4'
},
{
src: 'http://media.w3.org/2010/05/bunny/trailer.mp4',
type: 'video/mp4'
}
]
};
//listen for when the vjs-media object changes
$scope.$on('vjsVideoMediaChanged', function (e, data) {
console.log('vjsVideoMediaChanged event was fired');
});
}]);
View:
<div class="main-player-container">
<video class="video-js vjs-default-skin" autoplay preload="auto"
width="592" height="252" vjs-video vjs-media="mediaToggle">
</video>
</div>
index.html
...
<script src="libs/angular/angular.min.js"></script>
<script src="libs/angular-route/angular-route.min.js"></script>
<script src="libs/videojs/dist/video.min.js"></script>
<script src="libs/videojs-playlist/dist/videojs-playlist.min.js"></script>
<script src="libs/vjs-video/dist/vjs-video.min.js"></script>
<script src="js/app.js"></script>
<script src="js/appRoutes.js"></script>
<script src="js/services/CoubService.js"></script>
<script src="js/controllers/VideoChannelCtrl.js"></script>
...
<body ng-app="fooApp" ng-controller="VideoChannelController">
<div ng-view></div>
...