Angular 2 with Google Drive Realtime API

Question

I'm looking to create a new application based on the Drive Realtime API and want to do it with the shiny new Angular 2 framework. However, I'm kind of stuck trying to figure out how to best integrate the APIs and philosophies. I can't find any examples that use both.

What is the best way to get these two frameworks working together. In particular, how do I reconcile the differences between Angular's two way binding with ngModel and the Realtime APIs data binding with gapi.drive.realtime.databinding.Binding?

Answer 1

You can download the declaration file (*.d.ts) for the Google Drive Realtime API here. This provides a TypeScript wrapper for the API. Specifically, it defines a module named gapi.drive.realtime whose classes can be accessed in Angular2.

To tell the compiler about the declaration file, you need to add the following line to your TypeScript source file:

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

Then you need to import the module's features. One way to do this is with the following import command:

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

Then you can access the module's classes under the Drive namespace: Drive.Collaborator, Drive.CollaborativeObject, and so on.