我無法將字符串綁定到角度js中的html元素

Question

對不起，我是新的離子（angularjs）。我試圖從字符串綁定，該字符串包含youtub視頻網址。

<iframe width="280" height="150" src="//www.youtube.com/embed/UAHEQnOtzuw?list=UUj4nCgtjKJppK_IZeY8TUJg" frameborder="0" allowfullscreen></iframe> 

在控制器

$scope.videoElement.str = $scope.item.restData.videos[0].link; 

在HTML

<div ng-bind-html="videoElement.str"></div> 

，但我什麼也看不到。 :(

下面是截圖。http://screencast.com/t/Fgct1sdnOon

我怎樣才能解決這個問題？謝謝你的進步。

Answer 1

，除非你使用的$sce的鏈接不會附加到一個div。 繼續使用在iframe並嵌入URL作爲字符串：

<iframe width="280" height="150" ng-src="{{videoElement.str}}" frameborder="0" allowfullscreen></iframe>

如果你仍然需要在iframe綁定到一個div然後THI s是可能是你如何可以實現它：

控制器：

$scope.frame= '<iframe src="' + $scope.videoElement.str + '"></iframe>'; 

查看：

<div ng-bind-html="frame| safeHtml"> 

凡safeHtml是一個過濾器指令到HTML安全地結合並利用了$sce - Documentation

將此軟件包含在應用程序中：

app.filter('safeHtml', function ($sce) { 
    return function (val) { 
     return $sce.trustAsHtml(val); 
    }; 
}); 

UPDATE：如在上述提到的app.js

<div ng-bind-html="videoElement.str | safeHtml">

此外，添加的指令safeHtml：

如果$scope.videoElement.str是I幀鏈接，然後將下面的代碼將作爲足夠或控制器結束後。