谷歌api javascript客户端有时工作，有时是未定义的

Question

我正在使用Google API JavaScript客户端并遇到一个我无法解决的错误。

我的HTML文件有这样的脚本:

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

JavaScript是这样的

function init() {
      window.initGapi();
}
(function() {
"use strict";
var appControllers = angular.module('appControllers', ['ui.bootstrap']);
appControllers.controller('MusicCtrl', function($window, $modal, $scope ) { 
        $scope.list = function() {
            gapi.client.youtube.search.list({
                q: 'q',
                part: 'snippet'
            }).execute(function(response) {
                $scope.songs = response.result.items;
                $scope.$apply();            
            });     
        }
        $window.initGapi = function() {
            $scope.$apply($scope.load_youtube_api);
        }
        $scope.load_youtube_api = function() {
            gapi.client.setApiKey('API_KEY');
            gapi.client.load('youtube', 'v3', function() {
                $scope.is_backend_ready = true;
                $scope.list();
            });
        }

$scope.is_backend_ready使用HTML只加载$scope.list()的标记，只有当API已经加载。

得到的错误是Uncaught TypeError: window.initGapi is not a function。我注意到当我第一次加载页面时发生了这个错误，如果在调试过程中我在$scope.load_youtube_api函数上设置了一个断点，则API被正确加载。

我不明白初始化函数window.initGapi();, can， 有时和随机，当HTML应该只在后端准备好时加载时未定义。我从谷歌开发者网站得到了这个代码，所以也许我是错误的实现它。

Answer 1

似乎该函数在脚本加载之前被调用，Keep $window。$timeout内的initGapi函数，并在一秒后执行该函数