1

Google Client js API と一緒に Angular プロジェクトに js ファイルをロードする方法はちょっと難しいです。

この質問は、これを行う正しい順序について話しています。 Angular Js と google api client.js (gapi)

そして、これについて話している公式ドキュメント https://cloud.google.com/developers/articles/angularjs-cloud-endpoints-recipe-for-building-modern-web-applications/があります。

ドキュメントの1つのことは、無限ループを引き起こす init 内で window.init() を使用することです。

willlma が指摘したように、関数には別の名前を使用する必要があります。

しかし、 Uncaught TypeError: window.initGAPI is not a function というエラーに遭遇しました

プロジェクトは、Angular 用の Yeoman ジェネレーターを使用して作成されます。

index.htmlにjsを読み込む順番

<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
<script src="scripts/controllers/about.js"></script>
<script src="https://apis.google.com/js/client.js?onload=init"></script>

app.js (このファイルの後半部分のみ):

var init = function(){
    console.log("gapi init");
    window.initGAPI();
}

main.js:

angular.module('testApp')
  .controller('MainCtrl', function ($scope, $window) {
    $window.initGAPI = function(){
        console.log("controller inti");
    }
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  });

テスト用のログをいくつか置いたところ、window.init を呼び出す cliet.js をロードする前に $window.initGAPI の定義が実行されることがわかりましたが、window.init の内部では、window.initGAPI が定義されていません。メインコントローラーのようで、initGAPI という関数をオブジェクト window に定義するのに失敗しました。

4

2 に答える 2

1

同様の問題がありました。おそらく、コントローラーがまだロードされていないときに再試行するように、init 関数に対してこのようなことを試すことができます。

 function init() {
    if (window.initGapi != undefined) {
        window.initGapi();
    }
    else {
        setTimeout(init, 500); // wait for 500 ms
    }
 }
于 2015-12-12T00:03:03.000 に答える