CODEWITHSUNDEEP
angularjsgoogle-cloud-endpoints
Vincent Zhou
Vincent Zhou

Reputation: 503

AngularJS and google cloud endpoint: walk through needed

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.

Upvotes: 4

Views: 3816

Answers (3)

Douglas Correa
Douglas Correa

Reputation: 1015

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.

Upvotes: 5

Juan Saravia
Juan Saravia

Reputation: 7711

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

Upvotes: 0

Guy Nesher
Guy Nesher

Reputation: 1385

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.

Upvotes: 0

Related Questions