2016-07-24 58 views
0

我的要求是为视频,图片或笔记创建模板。所以,我为视频创建了一个指令并嵌入了YouTube网址。我没有看到任何错误和控制台看到正确的网址。但在用户界面上却是空白。AngularJs指令包含YouTube网址

指令

<ve-iframe video="item"></ve-iframe> 

app.directive('veIframe', function($compile, $sce){ 
     var linker = function(scope, element, attr) { 
      var youtubeUrl= 'http://www.youtube.com/embed/'; 
      var embed = youtubeUrl+scope.video.id.videoId; 
      console.log(embed); 
      var template = '<iframe id="player" type="text/html" width="520" height="300" ng-src="{{embed}}" frameborder="0"></iframe>'; 
      element.html(template).show(); 

      $compile(element.contents())(scope); 
     } 
     return { 
      restrict: 'E', 
      link: linker, 
      scope: { 
       video: '=' 
      } 
     } 
    }); 
+0

你有白名单资源吗? – dfsq

回答

0

我的错误,下面的代码行固定的问题

scope.embed = $ sce.trustAsResourceUrl(youtubeUrl + scope.video.id.videoId);