來自IE中字符串變量的iframe的src

Question

我有一個卑鄙的網站。 我想動態地構造一個包含有效html字符串的變量，然后在iframe中呈現它。 經過研究，我嘗試了以下代碼：（ JSBin ）

<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
        <script src="https://cdn.rawgit.com/jugglinmike/srcdoc-polyfill/master/srcdoc-polyfill.min.js"></script>
    </head>
    <body ng-app="app" ng-controller="Ctrl">
        <iframe srcdoc="{{content | toTrusted}}"></iframe>
        <script>
            var app = angular.module('app', []);
            app.controller("Ctrl", ["$scope", function($scope) {
                $scope.content = "<b>hello</b>";
            }])
            app.filter('toTrusted', ['$sce', function($sce) {
                return function(text) {
                    return $sce.trustAsHtml(text);
                };
            }]);
        </script>
    </body>
</html>

即使我使用src-polyfill ，它在Chrome中也能正常工作，而在IE（例如IE 11）中卻無法工作。

有沒有人有辦法解決嗎？

Answer 1

app.directive('iframeDoc', [ '$sce', function ($sce) {
                return {
                    restrict:"A",
                    scope:{
                        iframeDoc:'='
                    }, 
                    link: function(scope, elem, attrs) {
                        elem.attr("srcdoc", $sce.trustAsHtml(scope.iframeDoc));
                        // Check browser to support scrdoc.
                        var  isSupportSrcDoc= !!("srcdoc" in document.createElement("iframe"));
                        if(!isSupportSrcDoc){
                            var  jsUrl = "javascript: window.frameElement.getAttribute('srcdoc');";
                            if (elem[0].contentWindow) {
                                elem[0].contentWindow.location = jsUrl;
                            }
                            elem.attr("src", jsUrl);
                        }
                    }
                };
            }])

在html中：

<iframe iframe-doc="content"></iframe>

來自IE中字符串變量的iframe的src

問題描述

1 個解決方案

解決方案1
0 2018-08-31 07:07:25

來自IE中字符串變量的iframe的src

問題描述

1 個解決方案

解決方案1 0 2018-08-31 07:07:25

解決方案1
0 2018-08-31 07:07:25