Iframe中的AngularJs ng-src

Question

我正在尝试使用范围变量设置iframe的ng-src,并且它会一直显示为空白.

我试过这个:

<div ng-repeat="url in urls">
  <div ng-click="testAlert(url.domain)">
    <iframe ng-src="{{ url.domain }}" ></iframe>
    <div style="text-align: center">{[ url.domain ]}</div>
  </div>
</div>

文本显示得很好,所以我知道值和那里的点击警告选择域.只是ng-src似乎最终空白,因此不会拉起网站.如果我将ng-src硬编码到外部站点就行了.

Answer 1

很可能与$ sce没有被配置为在插值时信任外部资源...尝试将它放在你的控制器中(一定要注入$ sce服务).trustAsResourceUrl是您感兴趣的方法,您可以将要使用的URL传递给:

.controller("MainController", function ($scope, $sce) {
    var urls = [];

    //Need to trust resource to be able to interpolate, see $sce documentation
    urls.push({domain: $sce.trustAsResourceUrl("http://angularjs.org")});
    urls.push({domain: $sce.trustAsResourceUrl("http://www.jquery.com")});

    $scope.urls = urls;

    $scope.testAlert = function (value) {
        alert(value);
    }
});

看工作小提琴.