Unable to embed this directive inside a colorbox

[papes1ns]

My page has a list of links to youtube videos. If the user clicks on a link I want to open it in a jquery.colorbox. The following does not work. The colorbox opens with nothing in it and the youtube video is loaded behind it and is not wrapped in the colorbox.

View
<youtube-video class="youtube-video" video-url="videoURL" player-vars="playerVars" player="myPlayer"></youtube-video>

Controller
$scope.$on('youtube.player.ready', function ($event, player) { $(".youtube-video").colorbox({ open: true, }); });

[brandly]

this line doesn't look like it'll play very well with angular: $(".youtube-video").colorbox({ open: true, });

i haven't actually used colorbox in any form, but maybe this direction could help: https://github.com/igorlino/angular-colorbox