处理来自不受信任源的资源被阻止

Question

我在json文件中将youtube网址设为popup.bottom.url，我需要在页面上显示它们。但是我不能，因为似乎角度不允许这样。

<iframe width="560" height="315" src="{{popup.bottom.url}}" frameborder="0" allowfullscreen></iframe>

我尝试使用trystAsResource，但它只显示空src属性ergo视频未显示。我怎样才能实现我的目标？

我尝试了什么

• src="{{trustAsResourceUrl('url', popup.bottom.url)}}"

• src="{{trustAsResourceUrl(popup.bottom.url)}}"

Answer 1

你确实需要“信任资源网址”。但trustAsResourceUrl()是$sce服务的一种方法（未在$ scope上定义），因此您不能只使用src="{{trustAsResourceUrl(popup.bottom.url)}}"。

您可以在$scope上对其进行别名，如下所示：

ng-src="{{trustAsResourceUrl}}"

.controller('...', function ($sce, $scope) {
    ...
    $scope.trustAsResourceUrl = $sce.trustAsResourceUrl;

另请参阅此 short demo 。