AngularJS and google cloud endpoint: walk through needed

Question

I'm new to AngularJS but I really like the way AngularJS works so I want to deployed it as client side for my Google cloud endpoint backend. Then I immediately get two problems:

1, Where to put the myCallback, so it's able to work into the ANgularJs controller?

<script src="https://apis.google.com/js/client.js?onload=myCallback"></script>

2, How I'm able to do the oauth2? and how the controller knows if the user authorized?

gapi.auth.authorize({client_id: myCLIENT_ID,
      scope: mySCOPES,.....

Any help is appreciated.

Douglas Correa · Accepted Answer · 2015-02-18 19:20:38Z

5

For loading Google Javascript Library with AngularJs, the callback function passed to onLoad of Google Javascript Library is the function that bootstrap AngularJS, like this:

This goes to the final of html file:

<script src="https://apis.google.com/js/client.js?onload=startApp">

Then, in <head> section you bootstrap angular like this:

<script type='text/javascript'>

function startApp() {

    var ROOT = 'http://<yourapi>.appspot.com/_ah/api';
    gapi.client.load('myapifromgoogleendpoint', 'version1', function() {
        angular.bootstrap(document, ["myModule"]);
    }, ROOT);
}

</script>

As described by Kenji, you also need to remove ng-app directive from your html.

edited Feb 18, 2015 at 19:20

answered Apr 10, 2013 at 5:47

Douglas Correa

1,01512 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kenji Noguchi Over a year ago

To someone trying above, you have to remove ng-app, e.g. <html ng-app="myModule"> It's one of the "manual bootstrap" techniques, and it doesn't work when ng-app is set.

Riccardo Cossu Over a year ago

I think Kenji's comment should be included in the answer; it could save much time to people (angular beginners in particular)

Guy Nesher · Accepted Answer · 2013-04-09 15:28:24Z

Regarding the callback - In order to access an Angular controller you need to use an injector (http://docs.angularjs.org/api/AUTO.$injector)

Simply create a global callback function, and then get reference to the controller from it like this:

window.callbackFunction() {
  injector = angular.element(document.getElementById('YourController')).injector()
  injector.invoke(function ($rootScope, $compile, $document) {
    $rootScope.variable = "stuff you want to inject";
  })
}

In this example I'm injecting the data to the rootScope, but this will also work for a specific controller scope (just inject $scope instead)

Can't help with the second question as I'm not familiar with gapi, though making auth2 calls from angularjs is quite straight forward.

Juan Saravia · Accepted Answer · 2014-07-08 01:42:50Z

0

Here you have details on how to use angularjs with google endpoints:

https://cloud.google.com/developers/articles/angularjs-cloud-endpoints-recipe-for-building-modern-web-applications?hl=es

answered Jul 8, 2014 at 1:42

Juan Saravia

7,7116 gold badges32 silver badges42 bronze badges

Collectives™ on Stack Overflow

AngularJS and google cloud endpoint: walk through needed

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related