1

Somewhat of a novice to AngularJS, and I have question regarding an AngularJS application, and a popup that does not use Angular.

For example: An Angular application contains a directive that opens up a popup, sharing some of the scoped variables in the url as parameters. The popup contains some Prototype classes that manipulate the data, and returns an object, which the AngularJS application needs. I have minimal control of the prototype JS, as that code is somewhat legacy. I have attempted selecting an element in the Angular Application from the popup via jQuery, however this doesn't seem like the correct approach to solve this issue. How do you 'share' data between a non-AngularJS popup window and an AngularJS application?

acuriousbenjo
  • 11
  • 1

1 Answers1

0

You can post a message to the "opener" (the window that opened your popup) from your popup using something like this in your popup's code:

window.opener.postMessage(yourDataObject, 'https://www.yourdomain.com')

Be strict with the second parameter and only allow your domain. Never use '*' as if your data is (or becomes) sensitive, anyone could open your popup from their website and get this information.

Then in your AngularJS app (the opener), add a listener:

window.addEventListener("message", yourListenerFunction, useCapture)

To know if useCapture should be true or false, read Unable to understand useCapture attribute in addEventListener and see what's better for you depending on when you want to capture the event.

Younes for Wishtack

Community
  • 1
  • 1
Younes
  • 199
  • 5