jquery remove 函数是否也会删除淘汰赛绑定？

Question

我有一个使用淘汰赛绑定的 div。例如，

<div id='my_div'>
  <span data-bind="text: dialog_body"></span> 
</div>

所以，淘汰赛绑定是：

var viewmodel=function(){
 this.dialog_body = 'Some text';
};
ko.applyBindings(new viewmodel(),$("#my_div")[0]);

现在的问题是：如果我打电话给$('#my_div').remove();，这是否也会删除淘汰赛绑定，还是我应该担心内存泄漏？

Answer 1

您不需要从 DOM 中删除 span。只需修改您的 KO 跨度以包含可观察布尔值的“可见”绑定。然后，当您想“隐藏”您的跨度时，只需将布尔值设置为 false。

<span data-bind="text: dialog_body, visible: show_span"></span>

然后在您的 KO 代码中，使您的布尔值可观察：

var viewModel = { 
    show_span: ko.observable(true);
}

当你准备好隐藏跨度时：

viewModel.show_span(false);

Answer 2

jQuery 与 Knockout 无关。它可以删除节点——但这不会清理任何绑定的 KO observables。在给定的情况下，这将意味着存在 轻微 内存泄漏，因为在使用 jQuery 简单地删除节点后，KO 通过内部集合（请参阅ko.utils.domData）维护数据。

在 KO 中用于自行清理的两种传统方法是 cleanNode 和 removeNode（但两者都不会删除绑定事件！）应该根据需要使用.. 使用 cleanNode（在通过 KO 绑定的节点上）是最少需要清理数据。

---

不过，我觉得这里不适合手动清理KO！如果使用正确，标准绑定将已经处理清理。

改为编写如下代码。 （请参阅 Creating custom bindings that control descendant bindings 获取 withProperties；您还必须 make it virtual-element compatible 使用它，如下所示。）

<div id='my_div'>
  <!--ko 'if': someObservable-->
    <!--ko withProperties: { data: someObservable() }-->
      <span data-bind="text: data.dialog_body"></span> 
    <!--/ko-->
  <!--/ko-->
</div>

然后简单地将 observable 设置为创建节点的东西..

someObservable(myVm)

.. 或 undefined 清除它..

someObservable(undefined)

毕竟，一个人通常不会真的是$('#my_div').remove()，而是$('#my_div').dialog('close')。实际上删除节点也可以，只要稍后为新对话框添加 same 元素。

someObservable 值可能来自“根”视图模型 - 我建议使用根视图模型！ - 或者它可能来自一个窗口属性，对于那些感觉很老套的人：

window.someObservable = ko.observable()