1

ProcessClick関数を使用してビューモデルにバインドされた外側のdivと、実行時の内側のdivが別のビューモデルにバインドされていますが、クリックの関数名は同じです。何らかの理由で、内側の VM の関数が呼び出される前に、外側のモデルの関数のみが呼び出されます。

マークアップ:

<div id="max-outer">
   <span data-bind="click: BindInner">Bind Inner</span>
    <br/>
    <br/>
   <span data-bind="click: ProcessClick">Outer</span>
   <div id="max-inner">
      <span data-bind="click: ProcessClick">Inner</span>
       <br/>
   </div>
</div>

JS:

function InnderModel() {
    self = this;

    self.ProcessClick = function () 
        {
            alert("Inner clicked");
        };
}

function OuterModel() {
    self = this;

    self.ProcessClick = function (){
            alert("Outer clicked");
        };

    self.BindInner = function () {
        ko.cleanNode(document.getElementById("max-inner"));
        ko.applyBindings(new InnderModel(), document.getElementById("max-inner"));
    };
}

ko.applyBindings(new OuterModel(), document.getElementById("max-outer"));

ここにフィドルがあります： http://jsfiddle.net/mpavlov/H2ZnV/8/

Bind inner をクリックし、Inner span をクリックすると、両方ではなく、「Inner Clicked」アラートのみが表示されるという考えがあります。これは何とか達成できますか？

4

1 に答える 1

5

applyBindings内側のスパンは、最初に呼び出されたときにバインドされます。

呼び出しko.cleanNodeても実際にはイベントハンドラーは削除されないため、元のハンドラーは引き続き使用されます。

使用できるテクニックの1つは、knockmeout.netのこのヒントで説明されています。

これにより、Knockoutでバインディングをスキップする領域を特定できます。

元々バインドしたくない単純なカスタムバインディングをセクションに追加します。

ko.bindingHandlers.stopBinding = {
    init: function() {
        return { controlsDescendantBindings: true };
    }
};

このフィドルに示されているようになります。

于 2012-10-25T18:07:26.990 に答える