Мне потребовался один день, чтобы он работал, поэтому я думаю, что мой опыт может быть полезен кому-то. И, возможно, некоторые другие найдут улучшение.
Итак, я начинаю angularJS два дня назад. И я хочу, чтобы он работал с облачными конечными точками Google, чтобы создать интерфейсный интерфейс. Вот и проблема для меня.
Клиент javascript для gapi поставляется с асинхронной загрузкой, поэтому инициализация angular приведет к сбою, имеющему gapi undefined.
Итак, вам нужно перезагрузить angular, когда hexi инициализируется:
- удалить ng-app = "myApp"
- Добавить
<script src="https://apis.google.com/js/client.js?onload=googleOnLoadCallback"></script>
-
Добавить обратный вызов:
function googleOnLoadCallback(){ var apisToLoad = 1; // must match number of calls to gapi.client.load() var gCallback = function() { if (--apisToLoad == 0) { //Manual bootstraping of the application var $injector = angular.bootstrap(document, ['myApp']); console.log('Angular bootstrap complete ' + gapi); }; }; gapi.client.load('helloWorld', 'v1', gCallback, '//' + window.location.host + '/_ah/api'); }
Почувствуйте себя хорошо, но как насчет звонка?
Итак, вот контроллер:
angular.module('myApp.controllers', []).
.controller('MyCtrl', ['$scope' ,'helloWorldService',
function($scope,greetingsService) {
helloWorldService.loadData($scope);
}]);
И вот сервис:
angular.module('myApp.services', [])
service('helloWorldService', [function() {
this.loadData = function($scope) {
//Async call to google service
gapi.client.helloWorld.greetings.listGreeting().execute(
function(resp) {
if (!resp.code) {
console.debug(resp);
$scope.greetings = resp.items;
// Because it a callback,
// we need to notify angular of the data refresh...
$scope.$apply();
}
});
};
}]);
И волшебным образом ваши обновления страниц благодаря angular.
Не стесняйтесь отмечать везде, где я ошибаюсь.