問題タブ [ko.observablearray]

Observable Array があり、マッピング プラグインを使用して、サーバーからの json をマップします。json 構造は次のようになります。

このjsonには、さまざまなタイプのオブジェクトに関するデータが含まれており、カテゴリ値から、テンプレートに表示するものと表示しないものを決定します。

問題は、各項目のカテゴリが解析されたテンプレート内から変更される可能性があり、この変更が発生したときにテンプレートを更新する必要があることです。

このViewModelのノックアウトモデルがなく、サーバーから直接jsonをマッピングしています。

これを達成する方法は？カテゴリ プロパティを監視可能にしようとしましたが、これは何もしていません。

私は Knockout を使い始めたばかりで、それがフルパワーであることを認識していないことを付け加えなければなりません。

KnockoutのEditable Grid Exampleを使用し、 Steve Sanderson ブログに結び付けて、編集可能なグリッド内で DatePicker または datetimepicker を機能させようとしています。Ryan Niemeyerによってセットアップされた datepicker バインディングを使用することから始めましたが、これは監視可能な配列では機能しません。

したがって、コードは次のようになります。

バインディングで：

どんな助けや例も大歓迎です。これは、observerablearray の各項目自体が監視可能ではないことに関係していることはわかっていますが、Javascript が初めてなので、修正方法がわかりません。

Change イベントで「文字列は関数ではありません」というエラーが表示されます。次のように、フィールドを監視可能にするコードを追加すると、次のようになります。

その後、datetimepicker が機能し、ブラウザーが正しく更新されますが、データは投稿されないため、次の方法で投稿される実際のギフト配列は更新されません。

前もって感謝します。

監視可能な配列を使用して選択ボックスにオプションを設定しようとしています。設定するオプションを取得できますが、配列は 1 つのオプションとして表示されており、今見ても値がありません。

フィドルとコードは次のとおりです。

HTML:

あるアイテムを削除して別のアイテムを追加する必要がある監視可能な配列があります。監視可能な配列を呼び出し.remove(myItem)てから新しいアイテムをその配列にプッシュすると、Knockoutはその配列に対して2つの変更通知を発行しますが、この場合、これを1つの変更と見なし、1つの通知のみを発行します。

これを実現するために私が行ったことは、基になる配列を取り出して一時変数に保持し、次にその一時変数に変更を加え、完了したらすべてを監視可能な配列に戻すことです。 。このようなもの（私が実際に行っていることからいくらか単純化されています）：

これは私の目標を達成しますが、それを行う正しい方法のようには感じません。

監視可能な配列に複数の変更を加えるより適切な方法はありますが、1つの通知のみが発行されますか？

アップデート：

2つの通知を発生させたくない理由は、配列の変更をサブスクライブし、変更されるたびに新しいデータをロードするようにAJAXリクエストを作成するためです。このため、不要な通知を送信したくありません。配列の編集が「完了する」まで、通知が発行されないようにします。

observableArray内のアイテムのすべてのコンテンツを新しいコンテンツに置き換えようとしています。

私も試してみました

しかし、何も機能していません。インデックスは適切に取得されていますが、アイテムの更新は行われていません。

Knockout.js、require.js などを使用して MVVM Web アプリに取り組んでいます。問題は、ビューモデルのプロパティ (オブザーバブル配列の型) 内のアイテムにアクセスできないことです。

サンプル契約モデル:

サンプル ビュー モデル:

サンプル ビュー:

ビューモデルでアクセスする必要があるのはcontract.shoppingItemsすべて未定義です。

customerOverview ビュー モデルでオブザーバブルの長さを呼び出すと、長さゼロを受け取ります。バインディングがデータで更新されるため、オブザーバブルにデータが存在しますが、長さは 0 のままです。基本ビュー モデル 'CustomerCentral' は長さを適切に返します。いくつかの条件ステートメントを実行するには、「CustomerOverview」のオブザーバブルの長さが必要です。

HTML バインディング

JS

コンソール コマンド: vm.customerOverview().contacts().length 0

- - - - - - - - - - - - - -解決 - - - - - - - - - - - observableArray.push()

問題は次の行であることが判明しました：

解決策: これに .push() を追加すると、配列の長さプロパティをインクリメントできるようになりました。私は ko.mapping がこれを処理すると思っていましたが、そうではありません。変数を観測可能に変更しても効果はありませんでした。

クリックするとテキストボックスに変わるアンカーを表示するカスタムバインディングを作成しています。ユーザーが値を入力してEnterキーを押すと、その値はバインディングに渡されるobservableArrayにプッシュされます。

バインディングの大部分は、RyanNiemeyersの例から取得されました-ここにあります

html

バインディング

問題は、onEnterバインディングにバインドされている関数では、データパラメータが常に未定義であるため、新しい値が配列にプッシュされないことです。

完全な例については、私のフィドルを参照してください

UI の html フィールドにバインドされた監視可能な配列があります。

ただし、UI 上のこれらのフィールドへの変更はビューモデルには反映されません。これは、Knockout のドキュメントによると、observableArray は、それらのオブジェクトの状態ではなく、配列内にあるオブジェクトを追跡するためです。

コードは次のようになります。

HTML コード:

オブジェクトをオブザーバブル配列に追加または削除するとビューモデルのダーティ フラグが設定されますが、UI で変更すると考慮されません。

アプローチの 1 つは、オブザーバブル内に通常の配列を配置することです。

これまたはより良いアプローチを示すコード例はありますか?

助けてください。

observablearray 要素に適用した検証ルールに問題があります。カスタム メッセージ テンプレートを使用してエラーを表示しています。問題は、エラーがあるときに表示されないことですが、関連するフィールドに対して「*」が表示されます。以下は私のモデルです：

私が使用している検証構成は次のとおりです。

カスタム メッセージ テンプレートは次のようになります。

この実装では、カスタム テンプレートに検証メッセージが表示されません。しかし、構成 deep: true を削除すると、監視可能な配列要素は検証されませんが、他の監視可能な (ID) とメッセージが正しく表示されます。

私はこれに非常に混乱しており、少し立ち往生しているので、誰かが助けてくれれば感謝します/

前もって感謝します。