4

ドライブ リアルタイム API の導入について、Steve Bazylによるhttp://www.youtube.com/watch?v=HCyrywLtWIs&feature=g-user-uの YouTube ビデオを見ていました。彼は、リアルタイムと角度のあるフレームワークを扱うことは魔法のようだと述べました。私はそれがどのようなものになるかを調べ始めましたが、魔法は見られません. おそらく私がどちらの教祖でもなく、いくつかの小さなピースが欠けていることを私はよく知っています.

誰か教えてくれませんか?メモリ内のデータモデルを自動的にUIに接続し、他の編集者や実際のドライブファイルと同期させる非常に良い方法があると思います。私は近いですか?

4

1 に答える 1

8

マジカルというのは言い過ぎかもしれませんが、これらがうまく機能すると私が考える理由をいくつか紹介します。

  • モデルの型を宣言するのに時間がかかる場合、それらは 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"/>
于 2013-03-29T00:01:36.470 に答える