Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://www.youtube.com/iframe_api"></script>
<div ng-controller="MyCtrl">
<youtube-player video="theBestVideo" player="playerObject"></youtube-player>
</div>
JavaScript
var myApp = angular.module('myApp',['youtube-embed']);
myApp.controller('MyCtrl', function($scope){
$scope.theBestVideo = 'sMKoNBRZM1M';
$scope.playerObject = {}; //this will populate when youtube-video directive loads
//Alternatively you can also create a function in the scope to play
$scope.myPlayVideoFunction = function(){
$scope.playerObject.player.playVideo();
};
});
myApp.directive('youtubePlayer', function () {
return {
scope: {
video: '=',
player: '='
},
restrict: 'E',
template : '<youtube-video video-id="video" player="player"></youtube-video>' +
'<button ng-click="player.playVideo()">Play</button>'
};
});
/*
angular-youtube-mb v1.3.1
https://github.com/brandly/angular-youtube-embed
*/
angular.module("youtube-embed",[]).service("youtubeEmbedUtils",["$window","$rootScope",function(e,t){function r(e,t){return e.indexOf(t)>-1}function a(){t.$apply(function(){n.ready=!0})}var n={},i=/https?:\/\/(?:[0-9A-Z-]+\.)?(?:youtu\.be\/|youtube(?:-nocookie)?\.com\S*[^\w\s-])([\w-]{11})(?=[^\w-]|$)(?![?=&+%\w.-]*(?:['"][^<>]*>|<\/a>))[?=&+%\w.-]*/gi,o=/t=(\d+)[ms]?(\d+)?s?/;return n.getIdFromURL=function(e){var t=e.replace(i,"$1");if(r(t,";")){var a=t.split(";");if(r(a[1],"%")){var n=decodeURIComponent(a[1]);t=("http://youtube.com"+n).replace(i,"$1")}else t=a[0]}else r(t,"#")&&(t=t.split("#")[0]);return t},n.getTimeFromURL=function(e){e=e||"";var t=e.match(o);if(!t)return 0;var a=t[0],n=t[1],i=t[2];return"undefined"!=typeof i?(i=parseInt(i,10),n=parseInt(n,10)):r(a,"m")?(n=parseInt(n,10),i=0):(i=parseInt(n,10),n=0),i+60*n},n.ready=!1,"undefined"==typeof YT?(e.onYouTubeIframeAPIReady=a,console.log("Unable to find YouTube iframe library on this page.")):YT.loaded?n.ready=!0:YT.ready(a),n}]).directive("youtubeVideo",["$window","youtubeEmbedUtils",function(e,t){var...