1

私はこの例に基づいてコードを作成しました

http://jsfiddle.net/rniemeyer/WpnTU/

アイテムを選択するとき、ダイアログのタイトルにオブザーバブルの値を持たせたい

別のカスタムバインディングを作成することで、なんとか成功しました

ko.bindingHandlers.dialogOptions = {
    update: function(element, valueAccessor) {
        var options = ko.utils.unwrapObservable(valueAccessor());
        if (options ) {
          $(element).dialog(options);
        }         

    }
}

ビューモデルに新しいオブザーバブルを追加し、アイテムが選択されたときに設定します

this.selectProduct = function(product) {
        self.dialogOptions({ title: product.name() });
        self.selectedProduct(product);
}

実例: http: //jsfiddle.net/WpnTU/76/

それは動作しますが、私はそれが好きではありません。GUIと非常に結合された新しいobservableを追加します。すでに存在するselectProduct observableを使用して、GUIのnameプロパティを{title: selectProduct.name}

4

1 に答える 1

2

.dialogこれは、呼び出しをupdate関数に移動し、オプションをアンラップして、何かが変更されたときにトリガーされるように するサンプルです。

//custom binding to initialize a jQuery UI dialog
ko.bindingHandlers.jqDialog = {
    init: function(element) {
       ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
            $(element).dialog("destroy");
        }); 
    },
    update: function(element, valueAccessor) {
       var options = ko.toJS(valueAccessor());

        if (options) {
            $(element).dialog(options);
        }            
    }
};

nullであることを処理するためだけに、計算されたオブザーバブルをサンプルに追加しましたselectedProduct(インラインで実行できます)。

http://jsfiddle.net/rniemeyer/Gt5Hw/

于 2012-05-25T15:11:02.793 に答える