Google Picker API + Angular2获取Uncaught TypeError:无法读取属性' handleAuthResult'未定义的

时间:2017-03-02 12:26:58

标签: angular angular2-routing google-picker

我在我的应用程序中集成了Google picker API。 我正在关注官方文档Google Picker API

google api js i包含在我的index.html页面中,如docs

所示
 <script type="text/javascript" src="https://apis.google.com/js/api.js"></script>

这是html页面中的div:

<img src="../GoogleDrive.png(click)="onApiLoad()">  

这是我的组件代码:

  onApiLoad() {
         let self = this;
         gapi.load('auth', {'callback': self.onAuthApiLoad});
         gapi.load('picker');
     }

     onAuthApiLoad() {
         let self = this;
         window.gapi.auth.authorize(                
                 {
                     'client_id': "clientid",
                     'scope': ['https://www.googleapis.com/auth/drive.readonly'],
                     'immediate': false
                 },
                 self.handleAuthResult);
     }

      handleAuthResult(authResult:any) {
         let self = this;
         if (authResult && !authResult.error) {
             oauthToken = authResult.access_token;
             self.createPicker(oauthToken);
         }
     }

     createPicker() {
         let self = this;
         if ( oauthToken) {
             var pickerBuilder = new google.picker.PickerBuilder();
             var picker = pickerBuilder
             .enableFeature(google.picker.Feature.NAV_HIDDEN)
             .setOAuthToken(oauthToken)
             .addView(google.picker.ViewId.DOCS_VIDEOS)
             .setDeveloperKey('apikey')
             .setCallback(self.pickerCallback)
             .build();
             picker.setVisible(true);
         }
     }

     pickerCallback(data) {
         let self = this;
         if (data[google.picker.Response.ACTION] == google.picker.Action.PICKED) {
             var doc = data[google.picker.Response.DOCUMENTS][0];
             self.downloadGDriveFile(doc.id , doc.name);
         }
     }

     downloadGDriveFile(fileId, name){
}

我收到未捕获的TypeError:无法读取属性&#39; handleAuthResult&#39;未定义的。 任何人都可以帮助我..

1 个答案:

答案 0 :(得分:2)

我认为load方法没有在回调中提供词法this,尝试将this绑定到您的方法:

gapi.load('auth', {'callback': self.onAuthApiLoad.bind(this)});