問題タブ [knockout-mapping-plugin]

マッピングプロセス中にオブジェクトの（より適切な用語がないために）スキーマを変更することは可能ですか？私はそれがそうであると想像するでしょう、私はそれを機能させることができないようです。私はこのようなことを試みています：

knockout.mapping プラグインを RequireJS と組み合わせて使用​​すると、この問題が発生します。基本的に、私のアプリをホストしているサイトは、knockout、knockout.mapping、requirejs をこの順序でロードしています。

さらに何もしなくても、この不一致エラーが発生します。私が気付いていないある種の秩序はありますか？

/// アップデート ///

私はこれらの2つのテストを書きました：

• http://mjf.me/dev/requireTest.html
• http://mjf.me/dev/noRequireTest.html

基本的に、require.js を自分のプロジェクトに読み込むと、マッピング プラグインの前に、マッピング プラグインが見えなくなります。これは、マッピングプラグインがrequireをrequireとノックアウトに使用する方法に関係していると思います...しかし、失敗する理由を突き止めることはできません.

/// 2回目の更新 ///

ここではシナリオが重要なようですので、もう少し背景を説明します。

スクリプトタグでknockout.jsとknockout.mapping.jsを定義するWebアプリケーションを想像してください。次に、requireJS を使用して依存関係を確立するサード パーティのウィジェットがページに読み込まれます。問題を引き起こしているように見えるのは、その読み込みです。一部のライブラリは旧式の手動の方法でロードされ、他のライブラリは require を使用してロードされたため、require は既存のライブラリのコンテキストを混乱させているようです。

ホスト アプリケーションから require への参照を削除すると、ko.mapping が存在するかどうかを確認するために戻ってきたときにエラーが発生します。これは明らかに、ウィジェットがノックアウトの要求を行ったため、マッピング プラグインとの関係が何らかの形で壊れたためです。

これらのライブラリのスタックについてコメントするには、RequireJS に精通している人が必要だと思います。明らかに、匿名で消費するウィジェットを作成しているとき、消費者がどのように、またはどのように requireJS を使用しているかはわかりません。

/// 3 回目の更新 /// 問題を可能な限り明確にしようとすると、おそらくこれがより理にかなっています。

リソースを手動でロードする既存の Web ページに、RequireJS を使用するウィジェットを挿入できる、明確に定義されたパターンはありますか? RequireJS は、従来のページが既にロードしている可能性があるものを二重にロードするだけなので、それは不可能に思えます。

ノックアウト js とマッピング プラグインに問題があり、ソース データに子配列のモデルが作成されません

(これは私が作成できる小さなレポです。フィドルはここで入手できます: http://jsfiddle.net/msieker/6Wx3s/ )

つまり、InnerModel コンストラクターは呼び出されません。このスニペットとマッピング'InnerModel'内の両方でこれを試しました。'inner'私が見たほとんどの説明から、これはうまくいくはずですが、明らかに何かが欠けています。

誰でも私を正しい方向に向けることができるこれに関する経験がありますか?

編集: @John Earles の回答に基づいて、これを必要なものに少し近づけました。

ただし、parentInnerModel に渡されるのは ですnull。これを取得することが、マッピング プラグインを追求している理由です。optionsドキュメントは、これがパラメーターで関数に渡される必要があると私に信じさせますcreateが、代わりにobservable値がnull. この方向への追加の指針はありますか?

ユーザーがページにいる間、ビューモデルをどこに保持するかを理解するのに苦労しています。AJAXリクエストを作成し、ユーザーコントロール内のコントロールにビンジングを適用するユーザーコントロールがいくつかあります。マッピング プラグインを使用してビューモデルにデータを入力しています。ページに 4 ～ 5 個のユーザー コントロールがあります。変更を検出してサーバーに送り返すことができるように、ビューモデルをメモリに保持するのに苦労しています。今のところ、それらをwindow.Model1プロパティに保存していますが、これは良い考えではありません。

変更を検出できるようにビューモデルをメモリに保持する最良の方法を教えてください。それとも、私が完全に間違っているのでしょうか。この種のシナリオを処理するためのより良い方法があります。

これがすべてのコードです。

ユーザーコントロール:

Aspx ページ:

ウェブサービス：

顧客モデル:

ノックアウト js に大きく依存する大規模で複雑なページがあります。パフォーマンスが問題になり始めていますが、コール スタックを調べてボトルネックを見つけようとすることは、実際の課題です。

別の質問 ( Knockout.js - foreach と with の理解) で、受け入れられた回答にコメントがあることに気付きました:

with...そして、オーバーヘッドのために高いパフォーマンスが必要な場所では使用しないことをお勧めします...

声明が真実であると仮定すると、これは知っておくと非常に役立つ情報であり、そのようなパフォーマンスのヒントのソースは見つかりませんでした.

したがって、私の質問は次のとおりです。

従来のパフォーマンス チューニングに深く入る前に、アプリケーションのパフォーマンスを向上させるために適用できる一般的なガイドラインや重要なヒントはありますか。

私は次のコードを書きました

JSON データは次のようになります。

その部分はどのように書けばよいhtmlですか？

私はjavascriptが初めてです。助けてください。

IE8のノックアウトマッピングプラグインに問題があります。私たちの状況は、クライアントに表示できるすべての可能なレコードを送信することです。次に、レスポンシブシステムのクライアント側ですべてのページングとフィルタリングを処理します。

現在、jQueryajaxを介してjQueryテンプレートベースのグリッドに表示する250レコードのリストを送信しています。オブジェクトをマップするためにko.mapping.fromJS（fromJSON関数ではない）を呼び出すと、IE8から「スクリプトに時間がかかりすぎています」というメッセージが表示されます。FFとChromeでは、Javaスクリプトの実行速度がはるかに速いため、発生しません。

マッピングを調整する簡単な方法はありますか？クライアントに送信するレコードが1000近くある状況になる可能性があるため、これは長期的な問題です。

JSONデータオブジェクトを監視可能な配列にマップし、次に監視可能な配列の各項目を特定のタイプのビューモデルに初期化する方法はありますか?

ここでノックアウトとマッピングの例とともにノックアウトのすべてのドキュメントを見てきましたが、私が求めているものに役立つ答えが見つかりません。

したがって、次の JSON データがあります。

そして、私は次のビューモデルを持っています:

指定されたデータ構造とノックアウトのマッピング プラグインを使用して、結果の StateViewModel に 2 つの CityViewModel が入力された observableArray が含まれ、各 CityViewModel に 2 つの StreetViewModel が入力された observableArray が含まれることは可能ですか?

現在、マッピング プラグインを使用して StateViewModel にマップすることはできますが、「都市」および「通り」のコレクションには、都市およびストリート ビュー モデルのインスタンスではなく、一般的なオブジェクトが取り込まれています。

それらは正しい観察可能なプロパティと値で終わります。それらは私のビューモデルのインスタンスではありません。これが私が求めているものです。

Knockout.jsのマッパープラグインを使用して、サーバーからのJSONを処理しています。親と子を設定しましたが、親がいない子もいます。これらの迷子の子供は、新しい親または「里親」のようなモデルに入れ、里親にアクセスして別のリストの「foreach」で反復する方法を持っているハンドラーが必要です。

これが私がこれまでに持っているもののコードサンプルです：http：//pastie.org/3708368

ハンドラーは里親のためにどこに行きますか？それとも、特別な里親を両親に追加することはできますか？

基本的なユースケースは、子が（コンテキストを与えるために）割り当てられていないタスクであるというものです。

入力ありがとうございます！

Knockout のほとんどは非常に直感的です。私にとって奇妙なことの 1 つは、マッピング プラグインの仕組みです。私は、ajax 呼び出しから JSON をフィードし、HTML で参照できる一種の「動的」ビュー モデルを使用できることを期待/期待していました。

マッピングプラグインの説明は、次のように聞こえます。

「データ構造がより複雑になると (たとえば、子が含まれたり、配列が含まれたりすると)、手動で処理するのが非常に面倒になります。マッピング プラグインを使用すると、通常の JavaScript オブジェクト (または JSON 構造) からオブザーバブルへのマッピングを作成できます。モデルを表示します。」

しかし、実際にはコードで最初にビュー モデルを定義する必要があるようです。その後、マッピング プラグインといくつかの JSON データを使用して、後でビュー モデルを設定できます。これは正しいですか？

私がやろうとしていたことの具体例。

Solr (JSON 検索結果を返す検索エンジン) で Knockout を使用しようとしています。Solr によって返される JSON データのスケルトン構造は次のとおりです。

実際、これは、最初に設定したときに、マップされたビュー モデルに入力している構造です。

JSON データが Solr からどのように返されるかについて少し理解していただくために、response.docs 配列にはハッシュの配列が含まれており、ハッシュ データはインデックス付けされたドキュメント データのキー/値で構成されています。配列内の各ハッシュは、検索結果で返される 1 つのドキュメントです。

その部分はうまくマッピングされているようです。

JSON の「ハイライト」部分が問題の原因です。HTML で強調表示フィールドを参照しようとすると、ReferenceErrors が発生します。JSON で強調表示フィールドがどのように見えるかの例を次に示します。

各 response.docs 要素を解析しようとする HTML に foreach があり、オブジェクトの強調表示部分にそのドキュメントの Id フィールドとの一致が含まれている場合、デフォルトのタイトルではなく、強調表示されたタイトルに置き換えたいと考えています。(以下のコードでは、「Results」は、JSON をマッピングしているビューモデルの名前です。)

これを使用しようとすると、常に次のエラーが発生します。

データを参照する方法のバリエーションを試しましたが、アクセスできないようです。

編集私は少し前進しています。私のマッピング定義では、次のように「強調表示」を指定します。

強調表示を {} に設定するだけではありません。これで、マッピングを行うときに、ハイライト データを少し覗くことができます。それでも、まだ奇妙なエラーが表示されます。

テスト HTML コードを単純化して、各検索結果のハイライト データを吐き出すだけにしました。

<pre>これにより、次のような複数のタグが返されます。

ただし、その HTML コードを次のように変更すると:

次のようなエラーが引き続き発生します。

私には意味がありません！以前のテストでは、利用可能なデータに「タイトル」キーが含まれていることが示されましたが、なぜそのデータにアクセスできないのですか?

編集jsfiddleを作成しましたが、もちろん...期待どおりに動作します。jsfiddle で問題を再現できません。:-(

編集OK 私はここでいくらか前進していますが、何が起こっているのかまだ非常に混乱しています。まず、デバッグ HTML を次のように変更しました。

その後、ajax 呼び出しを送信したところ、Chrome コンソールに次の出力が表示されました。

したがって、何らかの理由で、foreachループは 3 つの Results.response.docs をループしており、最初の 2 つはハイライト() オブジェクトの何にもマッピングされていないため、未定義を返しています。プロパティは失敗していました。

これを確認するために、ko if: $root.Results.highlighting()[Id()]そのブロックを a で囲み、最終的に foreach ループ中に .Title プロパティに JS エラーなしでアクセスできました。

これにより、なぜ/どのように 3 つの Results.response.docs オブジェクトがループされているのかという疑問が残ります。おそらく foreach バインディングが 3 回実行され、最初の 2 回は強調表示オブジェクトが空で、3 回目は最終的に入力されているのでしょうか? しかし、私はそれがなぜなのかを理解するのに苦労しています。

もう 1 つの考えられる手がかり: ページをリロードせずに 2 回目の ajax 呼び出しをトリガーすると、これら 3 つの「パス」がすべて、コンソール ログで毎回有効なオブジェクトを返すことがわかります。したがって、2 つundefinedの と 1 つのオブジェクトの代わりに、3 つのオブジェクトがすべて並んでいます。

ただし、HTML 出力では、1 行のデータしか表示されません。これは、3 つの要素をループしているのではなく、実際には 3 回実行されていることを証明しているようです。問題は残ります...なぜですか？