angular 各scope 通信

一: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;


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章