1

我有一个外部 div 绑定到具有 ProcessClick 函数的视图模型，而运行时的内部 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实际上并没有删除任何事件处理程序，因此它仍然具有原始处理程序。

在knockmeout.net上的此技巧中描述了您可以使用的一种技术。

这允许您识别您希望 Knockout 跳过绑定的区域。

您将在您最初不想绑定的部分上添加一个简单的自定义绑定：

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

将如this fiddle所示。

于 2012-10-25T18:07:26.990 回答