无法使用 angularJS 将 URL 加载到 iframe答案

【问题标题】：Can't load URL into iframe with angularJS无法使用 angularJS 将 URL 加载到 iframe
【发布时间】：2015-01-15 09:17:59
【问题描述】：

使用 AngularJS，我试图将“myLink”URL 地址加载到另一个 html 中的 iframe。 data.No 是我从另一个地方提取的 ID 并且工作正常（获取我需要的 url 的 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

当我对 url 进行硬编码时，它工作正常。

【问题讨论】：

标签： javascript html angularjs iframe controller

【解决方案1】：

它对我有用：你可以用 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>

【讨论】：

【解决方案2】：

在你应该使用的控制器中：

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

【讨论】：

如果您有一个 url 或一组 url，这很好。如果您需要动态传递它们，因为您必须在控制器中设置它们而不是作为传递变种。虽然这是正确的。以下来自 saghar.fadaei 的答案是使用的解决方案。