angular 各scope 通信

发布时间：2020-12-17 09:47:24 所属栏目：安全来源：网络整理

导读：一：iframe 中的 controller 访问父页面中的controller a页面 !DOCTYPE html html ng-app="a" head meta charset="UTF-8" title/title script src="lib/angular/angular.min.js"/script /head body div id="view" ng-controller="dsViewCtr"/div script var

一：iframe 中的 controller 访问父页面中的controller

a页面

<!DOCTYPE html>
<html ng-app="a">
<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular/angular.min.js"></script>

</head>
<body>
<div id="view" ng-controller="dsViewCtr"></div>
<script>
var app = angular.module('datasheet',[]);
app.controller('dsViewCtr',function($scope) {
$scope.fullScreen=function(){
var scope=$window.parent.angular.element($window.frameElement).scope();//访问父层的controller
if(scope.fullClass=="fullClass"){
scope.fullClass=""

}else{
scope.fullClass="fullClass" ;

}

scope.$apply();
}
});
</script>
</body></html>

b页面

<!DOCTYPE html>
<html ng-app="b">
<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular/angular.min.js"></script>

</head>
<body ng-app="datasheet">

<div id="datasheetSrc" ng-controller="datasheetSrcCtr">
<iframe id="datasheetIframe" src="http://192.168.1.222:8080/a.jsp" ng-class= "fullClass"></iframe>
</div>
<script>
var app = angular.module('datasheet',[]);

app.controller('datasheetSrcCtr',function($scope)

{ $scope.fullClass = "full";});
</script>
</body>

</html>

二：外部的Js访问angular里面的根域

controller.js:

$rootScope.isActive=""

外部js:

var $body = angular.element(document.body);
var $rootScope = $body.scope().$root;
$rootScope.$apply(function () {
$rootScope.isActive=2 //把根的isActive变量改为2
})

三：外部的Js访问angular里面的其他controller的域

controller.js:

$scope.isActive=""

外部js:

angular.element(document.querySelector('[ng-controller=mainController]')).scope(). isActive=3//把 mainController里面的isActive改为3；

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!