問題タブ [custom-binding]

入力要素に KO カスタム バインディングがあり、その要素の css クラスの変更 (または追加) があったかどうかを検出する必要があります。これはカスタムバインディングを使用して検出するものですか?

customBindings を使用しようとしていますが、これを実現する方法がわかりません。ViewModel に DOM 操作を混在させてはいけないと人々が言っ​​ているのを聞いたので、CustomBindings を作成しようとしています。

Jsfiddle はこちらhttp://jsfiddle.net/Y3M6n/2/

ここに私のHTMLがあります

そして、これが私のjsコードです。

私の意図は、最初の div が入力を表示し、ユーザーがボタンをクリックした後に確認 div (非表示と表示される 2 番目の div) を表示することです。検証に合格した場合は、入力 (div1) の上に確認 div (div2) があるだけなので、ユーザーは新しい情報をすぐに入力できます。流れをスムーズに保つことがビジネス要件です。

Knockout.js を使用して、動的フォーム表示を接続しています。したがって、素敵な名前の付いたプロパティの代わりに、表示して接続する必要がある配列に任意の数の「フィールド」があります。近いと思いますが、カスタム バインディングの最後の仕上げに失敗しています。

データ

ko.mapping を使用して、この配列をオブザーバブルのオブザーバブル配列にマップしています。したがって、配列全体が観測可能であるだけでなく、「名前」や「値」などの各フィールドも観測可能です。この配列は、任意の数の要素を持つことができ、「名前」をキーにしています。

カスタム バインディング カスタム バインディング
が必要な理由は (私が思うに)、ビューで何かが変更されたときに、配列のどのメンバーが変更されたかを関連付けることができるようにするためです。繰り返しますが、名前がキーになっているので、簡単に検索します。それを確認してください：

マイ テンプレート
(配列の各要素を単純に反復する)

ただし、これを行うと、何も更新されません。Knockout コードを深く調べたところ、 というプロパティ_ko_property_writersが に存在しないallBindingsObjectことがわかりましたが、この時点で Knockout を理解することはできません。

何らかの理由で、以下のコードはリンクのクリック イベントを 2 回発生させます。私はノックアウトに比較的慣れていないので、カスタムバインディングが間違っている可能性があると思います。誰が私が間違ったことを教えてもらえますか? (ちなみに、フィドルを投稿しなかった理由は、jsfiddle に github のマッピング プラグインを含めることができないためです。)

JS:

html:

最初のように機能し、次のcustom bindingように機能するを書きました。if bindingvisible binding

if.init以前はとの両方をラップしていましたが、if.updateで正常に動作しましたKO 3.0が、 で削除されていることに気付きましたKO 3.1。

if.update関数をラップすることは可能KO 3.1ですか？または、これを達成するのに役立つ他の提案はありますか?

ありがとうございます。

ですから、これをやろうとしたのは私が初めてではないと確信していますが、私がやろうとしていることと一致する例が見つからないので、ここにいます.

そのように定義された Knockout カスタム バインディングがあります。

目標は、テーブルを作成したいユーザーが JavaScript について知っておく必要があることを最小限に抑えることです。提供してほしい HTML は次のようなものです。

列を配列のような形式で指定できるようにしたいです (ここでも、JS を使用しないようにしています)。col1: 'id', col2: 'first name' のようなばかげたことができることは承知していますが、作成するときに .length() を簡単に実行できるオブジェクト/配列が必要です私のテーブル。

Jqueryを使用してデータを操作する回避策がありますが、できればこのようなことをしたいと思います。

最後になりましたが、リースではありませんが、allBindings アクセサーを介してオブジェクトにアクセスできると想定しています。間違っている場合はお知らせください。前もって感謝します。

次のコードでは、viewModel.item オブザーバブルが更新されるたびに update 関数が実行されることを期待します。ページの読み込み時に init および update 関数が期待どおりに起動するのを確認できますが、オブザーバブルの値を更新するボタンをクリックすると起動しません。

マークアップ:

脚本：

同様の質問をいくつか閲覧しましたが、同等の例は見つかりませんでした。ここに JSFiddle を作成しました。