Angular-GAPI is an AngularJS module for accessing different Google APIs.
The code is based on ngGAPI
To use the module, include the main Angular-GAPI javascript file in your web page, as well as the scripts for all the API's that will be used:
<!DOCTYPE HTML>
<html>
<body ng-app="app">
//.....
<script src="bower_components/angular-GAPI/lib/angular-GAPI.js"></script>
<script src="bower_components/angular-GAPI/lib/plugin/gapi.calendar.factory.js"></script>
<script src="bower_components/angular-GAPI/lib/plugin/gapi.user.factory.js"></script>
</body>
</html>
ngGAPI requires Google API JavaScript client library
<script src="https://apis.google.com/js/client.js"></script>
$ bower install quivr/angular-GAPI --save
$ npm install quivr/angular-GAPI --save
then load it in your html
angular.module('myApp', [
'angularGAPI'
]);
After you register your app in the Google APIs Console, configure angular-GAPI with credentials and whatever scopes you need for your app.
angular.module('myApp')
.value('GoogleApp', {
apiKey: 'YOUR_API_KEY',
clientId: 'YOUR_CLIENT_ID',
scopes: [
// whatever scopes you need for your app, for example:
'https://www.googleapis.com/auth/drive',
'https://www.googleapis.com/auth/youtube',
'https://www.googleapis.com/auth/userinfo.profile'
// ...
]
})
To use a specific service, inject it into your controllers by name. All GAPI methods return a promise.
angular.module('myApp')
.controller('VideosCtrl', function ($scope, Youtube) {
$scope.videos = Youtube.search({ part: 'snippet', q: 'Search terms' })
});
- GAPI.init()
- GAPI.disconnect()
Note: If pop-ups are being blocked, make sure to have gapi loaded before calling GAPI.init().
gapi.load('auth', function() { GAPI.init() });
For a full documentation of the available functions, consult the wiki