title: Angular js: Display an iframe in a pop up and see an empty frame
body: <p>I am building an angularJs app.</p>
  
  <p>When i am clicking on a photo i would like that a modal screen will be shown with a player for playing a YouTube clip.</p>
  
  <p>When i type it hardcoded everything running fine. 
  However when i get it from the server the iframe is empty.</p>
  
  <p>In the controller
       </p>
  
  <pre><code>$scope.openVideoPlayerPopup = function (videoUrl) {
          var modalInstance = $modal.open({
              templateUrl: 'common/partials/videoPlayerModalScreen.html',
              controller: 'VideoPlayerModalCtrl',
              resolve: {
                  url: function () {
                    return videoUrl;
                  }
              }
          });
  
          modalInstance.result.then(function () {
  
          }, function () {
              console.log('Modal dismissed at: ' + new Date());
          });
      }; 
  </code></pre>
  
  <p>VideoPlayerModalController:</p>
  
  <pre><code>elbitApp.controller('VideoPlayerModalCtrl', ['$scope', '$modalInstance', 'url',
                                       function ($scope, $modalInstance,url) {
  
      $scope.givenUrl =  url;                        
  
      $scope.ok = function () {
          $modalInstance.close();
      };
  
      $scope.cancel = function () {
          $modalInstance.dismiss('cancel');
      };
  }]);
  </code></pre>
  
  <p>videoPlayerModalScreen.html:</p>
  
  <pre><code>&lt;div class="modal-header"&gt;
      &lt;h3 class="modal-title"&gt;Video Player&lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="modal-body-video"&gt;
      &lt;iframe width="420" height="345" ng-src='{{givenUrl}}'&gt;&lt;/iframe&gt;
      &lt;!--"https://www.youtube.com/embed/3O1_3zBUKM8"--&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
      &lt;button class="btn btn-primary" ng-click="ok()"&gt;OK&lt;/button&gt;
      &lt;button class="btn btn-warning" ng-click="cancel()"&gt;Cancel&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>If we put instead{{givenurl}},
  ng-src="https://www.youtube.com/embed/3O1_3zBUKM8"
  It will run fine...</p>
  
  <p>What am i doing wrong?</p>