0

リストの基礎となるKnockout.JSの監視可能な配列があります。

  self.list_elements = ko.observableArray([
     new list_element("0001", "product 1", "3.99")
  ]);

この配列の変数は監視可能です:

function list_element ( id, name, price ) {
   this.item_id = ko.observable(id);
   this.item_name = ko.observable(name);
   this.item_price = ko.observable(price);
}

クリックされたリスト要素のデータを入力したい詳細ビューもあります。例:

<span data-bind="text: an_item_id"></span>

これを埋める関数は、クリックハンドラーからそれぞれの配列項目を取得します。

self.fill_form = function ( array_item ) {
    // array_item is the array element corresponding to the selected list element
}

詳細ビューを配列の値に接続して、配列の値を変更すると詳細ビューに表示されるようにするにはどうすればよいですか?

4

1 に答える 1

0

通常、selectedオブザーバブルを作成し、現在選択されているアイテムを入力します。次に、を使用しwithて、選択したアイテムに固有のコンテキストでセクションをレンダリングします。

何かのようなもの:

var ViewModel = function() {
    var self = this;
    this.list_elements = ko.observableArray([...]);

    this.selected = ko.observable();

    this.fill_form = function(item) {
        self.selected(item);
    };
};

次に、次のようなセクションをバインドします。

<div data-bind="with: selected">
   ...
</div>

関数でロジックを実行する必要がない場合はfill_form、選択したオブザーバブルに対して直接クリックをバインドすることもできます。これは、アイテムがオブザーバブル(関数)への最初の引数として渡され、設定されるためです。その値。

サンプル例を次に示します。http://jsfiddle.net/rniemeyer/YPKk2/

于 2012-08-08T16:35:16.647 に答える