Angularjs: call other scope which in iframe

Question

In my test, given 2 document, A and B. In A document, there is an iframe, the iframe source is B document. My question is how to modify B document certain scope of variable?

Answer 1

The best way in my mind to communicate with the iframe is using window.top. If you want your iframe to get your parent's scope, you can set window.scopeToShare = $scope; within your controller and it becomes accessible for the iframe page at window.top.scopeToShare.

If you want your parent to get the iframe scope, you can use

window.receiveScope = function(scope) {
  scope.$on('event', function() {
    /* Treat the event */
  }
};

and within the iframe controller call window.top.giveRootScope($rootScope);

WARNING: If you are using this controller multiple times, make sure to use an additional ID to identify which scope you want.