title: How to dynamically test if YouTube Iframe API is loaded without onYouTubeIframeAPIready
body: <p>I have in AngularJS a directive which plays (etc) a YouTube video via YouTube IframeAPI. </p>
  
  <p>On the body of directive I will check if IframeAPI is ready by</p>
  
  <pre><code>var playerReady = $q.defer();
  window.onYouTubeIframeAPIReady = function() {
    console.log('YouTube API is ready.')
    playerReady.resolve();
  }
  </code></pre>
  
  <p>This is only executed once.</p>
  
  <p>Then, I have</p>
  
  <pre><code>return {restrict: 'E',
     link: function(scope, element, attrs) {
  </code></pre>
  
  <p>and so on where I am watching a scope variable, but that is not important here.</p>
  
  <p>Then, when my youtube element is made, I can in the link function init if with
  playerReady.promise.then(...</p>
  
  <p>)</p>
  
  <p>This is inside a <code>scope.$watch</code> callback.</p>
  
  <p>This works nicely, if my <code>youtube</code> element is present in the first route even though if the video will only be later set (I have <code>ng-show=..."</code> to hide it before certain event is triggered in the scope, also linker function watches this object in the scope), but if one navigates later to it (i.e. first route does not have my youtube element), I cannot resolve the playerReady anymore.</p>
  
  <p>To summarize, how can I dynamically test later that if youtube iframe api is ready and consequently resolve my <code>playerReady</code>? I could do that in my scope watcher.</p>
  
  <p>This in the directive body solves the problem</p>
  
  <pre><code>setTimeout(function(){
    playerReady.resolve();
  },3000);
  </code></pre>
  
  <p>but it is not how it is meant to be made.</p>