无法使用angularJS将网址加载到iframe中

时间:2014-11-18 08:46:53

标签: javascript html angularjs iframe controller

使用AngularJS,我试图将“myLink”URL地址加载到另一个html中的iframe。 data.No是我从另一个地方拉出来并且工作正常的ID(获取我需要的网址ID)

控制器中的

- “TransactionsCtrl”:

$scope.myLink = "http://"the real url"+ data.No +"&file="+ data.No +"&contract_id="+ data.No;
console.log($scope.myLink);
HTML中的

<div ng-controller= "TransactionsCtrl">
    <iframe ng-src="{{myLink}}"></iframe>
</div>

我得到的就是这个:

Error: [$interpolate:interr] Can't interpolate: {{myLink}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL

当我对网址进行硬编码时工作正常。

2 个答案:

答案 0 :(得分:23)

在控制器中你应该使用:

   $scope.myLink =  $sce.trustAsResourceUrl(myUrl)

答案 1 :(得分:7)

它适用于我:你可以在js代码中将其写为函数

$scope.trustSrc = function(src) {
  return $sce.trustAsResourceUrl(src);
}
$scope.iframe = {src:"http://www.youtube.com/embed/Lx7ycjC8qjE"};

并在您的视图中使用它:

 <iframe ng-src="{{trustSrc(iframe.src)}}"></iframe>

或者你可以把它写成像:

这样的过滤器
.filter('trusted', function($sce){
return function(url) {
    return $sce.trustAsResourceUrl(url);
};

})

并在视图中使用它:

 <iframe ng-src="{{iframe.src | trusted}}"></iframe>