CODEWITHSUNDEEP
javascriptangularjsfunctioniframe
garyM
garyM

Reputation: 892

How to can angularjs controller access functions in a non-angularjs iframe?

I'm trying to have an angularjs controller access javascript functions in a non-angularjs iframe. I don't know where to start. Looking for guidance.

Upvotes: 0

Views: 118

Answers (1)

dshun
dshun

Reputation: 223

normally to communicate with an iFrame is to use window.postMessage, which enables cross-origin communcation, and on the receiving end, in your case, the window which has your angular code, you can use angular.element($window).on("message", function() to do whatever you want.

angular.module('windowExample', [])
.controller('ExampleController', ['$scope', '$window', function($scope, $window) {

  angular.element($window).on("message", function(e){
                    alert(e.data);
    }); 
}]);

A sample js fiddle is the following. Obviously I cannot really use an iFrame, so i used a button to fake the message

http://jsfiddle.net/atozaxsv/22/

Let me know

Upvotes: 1

Related Questions