Question

这是一个JSFiddle开头。

HTML

<iframe id="iframe" src="http://fiddle.jshell.net/"></iframe>
<div id="test">click me</div>

的jQuery

$( "#test" ).on( "click", function() {
    var iframe = $("#iframe").contents();
    iframe.find('#header').css('background-color', 'red');
    iframe.find('#header').html('My content');
});

CSS

iframe {
    height: 500px;
    width: 800px;
}

问题

在上面的示例中，我可以使用jQuery编辑iframe的DOM内容而不会出现任何问题。
AngularJS可以做同样的事情吗？实施例
如果没有，是否可以使用ngInclude完成？实施例

Answer 1

只需使用

即可

<iframe id="iframe"  src="./data-model.html" my-iframe></iframe>
var app = angular.module("myTestIframe", []);
            app.controller('MyCtrl',function($scope){

            });
            app.directive("myIframe", function() {
                return {
                    restrict: "A",
                    link: function (scope,element) {
                        console.log(element.css('background-color', 'red'));
                    }

                }
            });

如果包含jquery库，您还可以使用$（element）

管理元素

AngularJS - 更改iframe或类似内容

1 个答案: