角NG绑定，HTML不与YouTube嵌入工作 [英] angular ng-bind-html doesn't work with youtube embed

问题描述

我尝试 jsfiddel 与NG-绑定-HTML。
它似乎并没有与YouTube嵌入到工作，为什么？

I try to jsfiddel with the ng-bind-html. it doesn't seem to work with youtube embed, why?

<div ng-app="App1">
  <div ng-app="App1" ng-controller="Ctrl">
      <div ng-bind-html="youtube">
      </div>
       <p>this is a youtube {{youtube}}</p>
  </div>
</div>

剧本

var myApp = angular.module('App1', ['ngSanitize']);

myApp.controller('Ctrl', ['$scope', function($scope){
    $scope.youtube = '<iframe width="560" height="315" src="//www.youtube.com/embed/FZSjvWtUxYk" frameborder="0" allowfullscreen></iframe>';

}]);

编辑：最初我的例子简化为只需添加一个链接，这要归功于IvorG我注意到，我没有添加ngSanitize作为一个依赖，增加的依赖后，我编辑的问题，以反映我有原来的问题：添加一个YouTube嵌入

Originally my example was simplified to just adding a link, thanks to IvorG I noticed that I didn't add 'ngSanitize' as a dependency, after adding the dependency I edited the question to reflect the original issue I was having: adding a youtube embed.

推荐答案

NG-绑定-HTML正与YouTube的嵌入
你只需要添加 $ sce.trustAsHtml（值）上所获取的＆LT值; IFRAME＆GT; 我有修改code。检查出来的 plunker ..for解决方案

ng-bind-html is working with youtube embed you just need to add $sce.trustAsHtml(value) on value that is fetching the <iframe> i have modified your code Check out the plunker ..for the solution

的index.html

<div ng-app="App1">
  <div ng-app="App1" ng-controller="Ctrl">
    <H1>This is a youtube Embeded Video</h1>
      <div ng-bind-html="youtube"></div>
  </div>
</div>

的script.js

var myApp = angular.module('App1', ['ngSanitize']);

myApp.controller('Ctrl', ['$scope','$sce', function($scope,$sce){
    $scope.youtube = $sce.trustAsHtml('<iframe width="560" height="315" src="//www.youtube.com/embed/FZSjvWtUxYk" frameborder="0" allowfullscreen></iframe>');


}]);

这篇关于角NG绑定，HTML不与YouTube嵌入工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！