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);
    }
});

查看工作fiddle。