マジカルというのは言い過ぎかもしれませんが、これらがうまく機能すると私が考える理由をいくつか紹介します。
モデルの型を宣言するのに時間がかかる場合、それらは angular のデータ バインディングで問題なく機能し、プロパティは ng-model で使用できます。
さらに重要なことは、Angular の仕組みのおかげで、リモート イベントの処理が簡単になることです。本当に必要なのは、1 つのイベント リスナーだけです。
doc.getModel().getRoot().addEventListener(
gapi.drive.realtime.EventType.OBJECT_CHANGED,
function(event) {
if (!event.isLocal) {
$rootScope.$digest();
}
});
リモート イベントに応じて UI が適切に更新されるようにするために必要なことはこれだけです :)
いくつかの例外:
共同ストリングスは特別です。カーソル位置を気にしない場合は、簡単なモンキー パッチを実行して、テキストを ng-model で動作する標準プロパティとして公開できます。
Object.defineProperty(gapi.drive.realtime.CollaborativeString.prototype, 'text', {
set:function (value) {
return this.setText(value);
},
get:function () {
return this.getText();
}
});
次に、次のような共同文字列にバインドできます。
<input type="text" data-ng-model="myCollaborativeString.text"/>
カーソルを適切に配置するために、再利用可能なディレクティブを作成することはそれほど難しくありません。便利なディレクティブなどのコレクションを今後数週間以内に github で開始する予定です。そのため、属性を追加するだけで完全にコラボレーション可能なテキスト フィールドを簡単に作成できます。
<textarea data-rt-collaborative data-ng-model="myCollaborativeString"/>