0

Scenario: I have an AngularJS app that uses Google's auth.

Depends on the resource, when Angular calls (my) backend, it can return a response asking for Oauth token. In this case, Angular will show a popup (not a Bootstrap's modal dialog) with that redirect URL.

Google will authenticated, ask for permission, and send the user back to me. There is a callback URL that will process the 'code' and get the real token. This callbak URL will be called inside that popup.

When I get the token, the popup should close itself, and notify Angular to try that last request again (now I have the token in user's session)

Problem: how can a popup emit an Angular event?

Actually, it doesn't need to be that $rootScope.$emit, but just a way to notify Angular.

I saw this option, but it doesn't seem good for Angular :(

Community
  • 1
  • 1
Falci
  • 1,823
  • 4
  • 29
  • 54

2 Answers2

0

you can use localStorage events, take a look at this demo: http://html5demos.com/storage-events

// this should be in the main page
$window.addEventListener('storage', function(event) { 
  if(event.key === 'login-notification') {
    // got it!
    // you can get the value from 
    // the notification with "event.newValue"
  }
}, false);

// send the event with just a setItem from the popup
$window.localStorage.setItem('login-notification', 'ayy');
UnnoTed
  • 26
  • 1
  • 4
0

Create a service first. 

app.service("servicee", function(){
  return {
    set : function(k,v){
          this[k] = v;    
     },
     get : function (k){
        return this[k]
     }
  }
});

Now in the popup you can set the token in the service, now you have the value available throught out the app. Also you can $watch the specific key in the service and take some action when the value is set.

Saneesh B
  • 572
  • 4
  • 13
  • Are you sure? The Angular service will continue *singleton* between two browser windows? – Falci Jun 01 '16 at 12:24
  • Oh, so it has to be singleton between windows that wasn't clear in the question.Use the [ng-storage](https://github.com/gsklee/ngStorage) module, use the 'set' method to set it to storage and the the 'get' method to retrive it – Saneesh B Jun 01 '16 at 12:41