自定义绑定，绑定＆init - knockout.js

Question

我们使用基于多视图模型的SPA的敲除来处理可见的视图，我们已经包装了divs，我们在with bindings中绑定了“子”视图模型。

我们看到的问题是，当视图可见性切换时，它内部的自定义绑定将被执行，每次都会执行init &更新。

当我们根据这个jqdialog binding进行绑定并且在每个init上创建一个新对话框并将其添加到我们的DOM中时，这会对我们造成问题，但是我们没有简单的方法知道它应该被删除。

或多或少，这是一个问题，如果我们应该重新安排我们arcitecture的这一部分，或者如果我们的绑定中缺少某些东西。

简单的观点：

<div id="view"> 
    <button data-bind="click: on">On</button> 
    <button data-bind="click: off">Off</button> 

    <div data-bind="with: visible"> 
    <span data-bind="foo: ''">foo</span> 
    visible 
    </div> 

</div>​​​​​​​​​​ 

JS：

ko.bindingHandlers.foo= { 
    init: function() { 
    alert("init"); 
    }, 
    update: function() { 
    alert("update"); 
    } 
} 


var vm =(function() { 
    var self = this; 
    self.visible = ko.observable(false); 

    self.on = function() { self.visible(true); }; 
    self.off= function() {self.visible(false); }; 

})(); 

ko.applyBindings(vm, document.getElementById("view")); 

小fiddle简略地表示我们的错误。

Answer 1

您的问题是您没有切换可见性。当您使用with时，您每次都将相同的元素删除并重新插入到DOM中。这当然会导致绑定被重新创建，并且会再次触发该功能。

如果您只想隐藏/显示，请使用可见绑定。

所以，如果你这样做：

<div data-bind="visible: visible"> 
    <span data-bind="foo: ''">foo</span> 
    visible 
</div> 

你会看到你结合时初始化页面加载并不会再次为你显示/隐藏初始化。见here。