角度-通过不同的帧附加html,每帧一个模块
我的代码有主windonw和一个iframe,每个都带有模块。主窗口中的一个按钮触发click事件,该事件应将html追加到iframe中,追加到iframe中的新html应正确应用拦截器和指令,但它不起作用! 角度javascript:角度-通过不同的帧附加html,每帧一个模块,html,angularjs,iframe,Html,Angularjs,Iframe,我的代码有主windonw和一个iframe,每个都带有模块。主窗口中的一个按钮触发click事件,该事件应将html追加到iframe中,追加到iframe中的新html应正确应用拦截器和指令,但它不起作用! 角度javascript: angular.module('module1',[]).controller('Controller1', function ($scope) { $scope.get = function(){ $http.jsonp("some_url_he
angular.module('module1',[]).controller('Controller1', function ($scope) {
$scope.get = function(){
$http.jsonp("some_url_here").success(function(html){
$scope.content = html;
});
}
}).directive('click', function($compile) {
return {
link: function link(scope, element, attrs) {
element.bind('click',function(){
var unbind = scope.$watch(scope.content, function() {
var div=document.getElementById("frame").contentWindow.angular.element("divId");
div.append($compile(scope.content)(div.scope()));
unbind();
});
});
}
}
});
angular.module('module2',[]).directive('a', function() {
return {
restrict:'E',
link: function(scope, element, attrs) {
console.log('ping!');
console.log(attrs.href);
}
};
});
Html代码:
<html ng-app="modile1">
<div ng-controller="Controller1">
<button type="button", ng-click="get('any_value')", click:""/> Load frame
</div>
<iframe id="frame" src="/please/ignore/this">
<!-- considere the html as appended from iframe-src and contains ng-app="module2" -->
<html ng-app="module2">
<div id="divId">
<!-- code should be inject here -->
</div>
</html>
</iframe>
</html>
承重架
请考虑angularjs、jquery(如果适用)、模块声明以及标题是否正确加载
我希望将html内容从主框架/窗口加载到iframe中,并正确运行拦截器和指令。可能吗?如果是,我怎么做
谢谢你的进步 我已经尝试过这个代码,它似乎工作得很好!我在这里找到的:
var $rootElement = angular.element(document.getElementById("frame").contentWindow.document);
var modules = [
'ng',
'module2',
function($provide) {
$provide.value('$rootElement', $rootElement)
}
];
var $injector = angular.injector(modules);
var $compile = $injector.get('$compile');
$rootElement.find("div#divId").append(scope.content);
var compositeLinkFn = $compile($rootElement);
var $rootScope = $injector.get('$rootScope');
compositeLinkFn($rootScope);
$rootScope.$apply();