如何访问Angular 2 Component中的全局变量

Question

我想从typescript中的angular 2模块访问googleapi库。如何做到这一点。当我尝试访问（gap）时，我得到了未定义的。有没有任何NPM模块可以作为angular 2中的typescript库工作，我可以使用它，或者我必须使用js文件。

以下是模块代码和库参考：

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

    @Component({
    selector: "main-app",
    template: "{{title}}",
    providers: [HTTP_PROVIDERS, AuthService]
})
export class AppComponent implements OnInit {
    public title: string = '';
    constructor(private _authService: AuthService) {
        var gapi: any;
        console.log(gapi); // undefined
    }
    ngOnInit() {
        this._authService.getAuthSettings().subscribe((set: AppSetting) => {
            this.title = set.Scopes;
        });
    }
};

Answer 1

您的代码中有：

    var gapi: any;
    console.log(gapi); // undefined

行var gapi在运行时创建一个新的局部变量。您不希望创建局部变量。您想要声明全局存在。创建一个globals.d.ts文件并添加以下内容：

declare var gapi:any;

更多

JavaScript到TypeScript迁移指南：https://basarat.gitbooks.io/typescript/content/docs/types/migrating.html

Answer 2

您可以通过引用窗口轻松访问全局变量，如

gapi = window["gapi"];

或

let gapi = window["gapi"];