带有 Google Drive Realtime API 的 Angular 2答案

【问题标题】：Angular 2 with Google Drive Realtime API带有 Google Drive Realtime API 的 Angular 2
【发布时间】：2016-02-14 03:20:58
【问题描述】：

我正在寻找基于 Drive Realtime API 的新应用程序，并希望使用闪亮的新 Angular 2 框架来实现。但是，我有点想弄清楚如何最好地集成 API 和理念。我找不到任何个同时使用两者的例子。

让这两个框架协同工作的最佳方式是什么。特别是，我如何调和 Angular 与 ngModel 的双向绑定和与 gapi.drive.realtime.databinding.Binding 的实时 API 数据绑定之间的差异？

【问题讨论】：

【解决方案1】：

您可以下载 Google Drive Realtime API here 的声明文件 (*.d.ts)。这为 API 提供了一个 TypeScript 包装器。具体来说，它定义了一个名为 gapi.drive.realtime 的模块，其类可以在 Angular2 中访问。

要告诉编译器声明文件，你需要将以下行添加到你的 TypeScript 源文件：

///<reference path="google-drive-realtime-api.d.ts" />

然后你需要导入模块的特性。一种方法是使用以下import 命令：

import * as Drive from "gapi.drive.realtime";

然后就可以访问Drive命名空间下的模块类：Drive.Collaborator、Drive.CollaborativeObject等。

【讨论】：

感谢您的回复。我熟悉使用类型定义和使用 System.js 导入。我的不是一个简单的'如何在 Typescript 中使用 ES5 库？' 问题。我的问题更多是关于调和方法之间的差异，例如数据绑定。我确信我可以破解它以使其工作，但我正在寻找关于如何在 Angular 2 等环境中最好地使用具有协作使用限制的库的想法、经验和模式。
@MattScarpino 我们需要 npm install google drive api 吗？
@MattScarpino：应该在哪里添加参考？我执行了“npm install”，但无法理解需要在哪里添加参考。