AngularJS阻止加载资源

Question

我不知道为什么，但是我正在尝试创建一个图像按钮，而URL来自于在我的控制器中获取JSON对象，但是链接是通过错误进行的，如果我将其更改为工作正常!!!

控制器：

$scope.iconImage = 'http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png';

HTML：

<!-- Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy. -->
<input type="image" ng-src="{{iconImage}}" />

<!-- This works fine -->
<img ng-src="{{iconImage}}" />

Answer 1

您可以使用Strict Contextual Escaping（SCE）模式将URL标记为安全内容源。

请参阅trustAsResourceUrl(value);

在控制器中注入[$ sce]，然后像这样使用它：

$scope.iconImage = $sce.trustAsResourceUrl('http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png');

Answer 2

您可以使用$sceDelegateProvider对网址进行白名单。请参阅here。