google drive javascript api TypeError: Cannot read property 'drive' of undefined in gapi.client.drive.files Angular 4 Ionic 2

Question

I am working with Angular 4/Ionic 2 and have followed javascript Google Drive documentation https://developers.google.com/drive/v3/web/quickstart/js to list google drive files but i am getting error (ERROR TypeError: Cannot read property 'drive' of undefined).

I have also followed this question Call gapi.client.load(...) Before all my executions correct? On implementing this i get an error that (load is undefined).

While following this question Google Drive API javascript I have implemented its 1st answer and get an error on

var request = gapi.client.request({
        'path': '/drive/v2/files',
        'method': 'GET',
        'params': {'maxResults': '1'}
        });

gapi.client.request is undefined.

Currently my function of getting files from google drive is

 listFile() {
        var request = gapi.client.drive.files.list({
            'pageSize': 10,
            'fields': "nextPageToken, files(id, name)"
          });

          request.execute(function(resp) {
            this.appendPre('Files:');
            var files = resp.files;
            if (files && files.length > 0) {
              for (var i = 0; i < files.length; i++) {
                var file = files[i];
                this.appendPre(file.name + ' (' + file.id + ')');
              }
            } else {
              this.appendPre('No files found.');
            }
          });
  } 

The tutorial i completely followed is Google Drive API in Angular2/Ionic2 gapi.client.drive

I have implemented all of the above solutions but they are not working in my case. Anyone help will be appreciated. Thank you