0

クライアント側のjsライブラリとしてknockout.jsを使用するMVC3アプリケーションに取り組んでいます。リストのようなコントロールとグリッドを備えた複雑な画面があり、knockout.js を使用して JavaScript によってデータが取り込まれます。私の問題は、すべてのコントロールが完全にバインドされている場合、つまりエンド ユーザーが使用する準備ができている場合に、イベントをインターセプトする方法がわからないことです。現在、ページはブラウザに 7 秒で読み込まれますが、コントロールがデータにバインドされるまでに約 20 ～ 30 秒かかるため、すべての準備が整うまでページが使用できなくなります。すべてのコントロールが完全にバインドされたことを知る方法はありますか? 前もって感謝します。

4

1 に答える 1

0

ビューモデルまたはカスタム バインダーに非同期ロジックがない限り、コード行を の直後に配置できますapplyBindings。

ko.applyBindings(myViewModel);   
doSomethingElse();

これを示す長期実行バインダーのフィドルを次に示します (必ずコンソールを開いて出力を確認してください): http://jsfiddle.net/tlarson/bPaCb/

ただし、非同期ロジック (ajax を使用した Web サービスの呼び出しなど) がある場合は、コールバックを使用して、すべての完了後にコードを実行する必要があります。これが私が通常行うことです：

  1. データがまだロードされていないことを示すブール値オブザーバブルを使用して、ビュー モデルをセットアップします。self.isLoaded = ko.observable(false);
  2. オブザーバブルが false の場合に表示される「待機中」インジケーター (スピナーなど) を追加します。<div data-bind=visible:!isLoaded()"><img src="spinner.gif"></img></div>
  3. 同様に、isLoadedtrueになるまでビューを非表示にします。<div data-bind="visible:isLoaded">Data views go here</div>
  4. を呼び出しapplyBindings(myViewModel);て、すべてのバインディングをセットアップします。これには、まだ ajax 呼び出しを含めないでください。データは空にする必要があります。
  5. データをロードする ajax 呼び出しを行います。データが戻ってきたら、ビューモデルの適切なデータ プロパティを更新し、isLoadedtrue に設定します。これにより、スピナーが非表示になり、データが表示されます。
于 2013-05-10T14:44:49.807 に答える