knockout - 'with'指示が出されたときに通知する

Question

こんにちは私は以下のシナリオを持っています。私が編集ボタン上のバインディングを失う - いくつかの要素が

<!-- ko with: model.selected_item --> 
<tr> 
<td style="width:20%">Name:</td> 
<td style="width:80%" class="field" data-bind="text: name"></td> 
<td style="width:10px"><div class="btn_edit"></div></td> 
</tr> 
<tr> 
etc... 
<!-- /ko --> 
$("div.btn_edit", component.context).on("vclick", function(e){ 
//edit it 
} 

で内にネストされている

私が持っている問題は、selected_itemが変化していることです。 このシナリオでは、model.selected_itemに登録してバインディングを再適用するのは少し難しいので、withディレクティブ内の要素が更新されてから再適用されるときに通知を受けたいと思います。 これを達成するためのノックアウトの具体的な方法はありますか？

非常に助かりました。

Answer 1

この問題が発生するのは、アイテムを更新するたびにクリックハンドラ要素がテンプレートエンジンによって破棄されるためです。

ここでは、jqueryデリゲートバインディングに頼らずに、あなたが望むものを実現する方法の例を示します。これは、彼らがうまくいけば、不要なDOM操作であなたの素敵なKOモデルをポーリングしています。 KOアプリで古い$（）セレクタを使用していることが分かるたびに、より優れたモデル指向の方法があるかどうかを真剣に検討する必要があります。

http://jsfiddle.net/madcapnmckay/EFQ9S/

これの要点は、モデルが真のJSクラスに変換し、KOのクリックイベントではなく、jQueryのクリックハンドラをバインドするために、これらを使用することです。このアプローチの美しさは、KOが破壊されたときにあなたの要素を元に戻すことです。

var item = function (config) { 
    var self = this; 
    this.name = ko.observable(config.name); 
    this.edit = function() { 
     $("body").append("<div>lets edit " + self.name()+"</div>"); 
    }; 
}; 

var model = function() { 
    this.item = ko.observable(); 
    this.pushNew = function() { 
     this.item(new item({name: "new name"})); 
    }; 
} 

$(document).ready(function(e) { 
    var mymodel = new model(); 
    ko.applyBindings(mymodel); 

    mymodel.item(new item({ name: "the_name" })); 
}) 

これが役に立ちます。