angular ng-bind-html doesn't work with youtube embed

angularjs

Solution

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>');


}]);

Problem

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> ``` script ``` 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>'; }]); ``` EDIT: 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.

Original source

Related problems