在AngularJS中将iframe动态插入页面

一尘不染

angularjs

我正在尝试使用Angular 1.2将iframe动态插入页面中。这是代码：

HTML：

<div id="player_wrapper" ng-cloak>
    <div ng-bind-html="player"></div>
</div>

js：

$http({method: 'GET', url: url}).
    success(function(data, status) {
        $scope.player = data.html;
    }.......

因此data.html是一个具有有效HTML开头的字符串

<iframe ...>

该字符串还包含一些div。所以它看起来像：

<iframe src='...' ...></iframe><div>some stuf</div>

我在app.js’ngSanitize’中使用。它显示的是div（在iframe之后），而不是iframe本身。

如果我使用jQuery，基本上

$(#'player_wrapper').html(data.html)

效果很好…但是试图使其正确的angularJS。

关于为什么只显示iframe之后的div的任何想法？

非常感谢大家

阅读 433

2020-07-04

共1个答案

一尘不染

ngBindHtml$sce.getTrustedHtml在显示之前将通过您的HTML
。我怀疑这将是删除您的iframe的原因。

根据文档，您可以使用$
sce.trustAsHtml避免此检查，只要您完全信任来自此来源的任何HTML-来自不受信任来源的iframe可能会对您页面访问者造成很多麻烦。

$http({method: 'GET', url: url}).
    success(function(data, status) {
        $scope.player = $sce.trustAsHtml(data.html);
    }.......

小心！:)

2020-07-04