如何在Knockout.js中清除/删除可观察的绑定？ [英] How to clear/remove observable bindings in Knockout.js?

问题描述

我正在网页上构建功能，用户可以多次执行此功能。通过用户的操作，使用ko.applyBindings（）创建对象/模型并将其应用于HTML。

I'm building functionality onto a webpage which the user can perform multiple times. Through the user's action, an object/model is created and applied to HTML using ko.applyBindings().

数据绑定HTML是通过jQuery模板创建的。

The data-bound HTML is created through jQuery templates.

到目前为止一切顺利。

当我通过创建第二个对象/模型并调用ko.applyBindings重复此步骤时（）我遇到两个问题：

When I repeat this step by creating a second object/model and call ko.applyBindings() I encounter two problems:

1. 标记显示上一个对象/模型以及新对象/模型。


2. 与对象/模型中的某个属性相关的javascript错误，虽然它仍然在标记中呈现。

为了解决这个问题，在第一次传递之后，我调用jQuery的.empty（）来删除包含所有数据绑定属性的模板化HTML，这样它就不再存在于DOM中了。当用户启动第二遍的过程时，数据绑定的HTML将重新添加到DOM中。

To get around this problem, after the first pass I call jQuery's .empty() to remove the templated HTML which contains all the data-bind attributes, so that it's no longer in the DOM. When the user starts the process for the second pass the data-bound HTML is re-added to the DOM.

但就像我说的那样，重新添加HTML时对于DOM并重新绑定到新的对象/模型，它仍然包含来自第一个对象/模型的数据，并且我仍然得到在第一次传递期间不会发生的JS错误。

But like I said, when the HTML is re-added to the DOM and re-bound to the new object/model, it still includes data from the the first object/model, and I still get the JS error which doesn't occur during the first pass.

结论似乎是Knockout坚持这些绑定属性，即使从DOM中删除了标记。

The conclusion appears to be that Knockout is holding on to these bound properties, even though the markup is removed from the DOM.

那么什么我正在寻找从Knockout中删除这些绑定属性的方法;告诉淘汰赛，不再有可观察的模型。有没有办法做到这一点？

So what I'm looking for is a means of removing these bound properties from Knockout; telling knockout that there is no longer an observable model. Is there a way to do this?

编辑

基本流程是用户上传文件;服务器然后用JSON对象响应，数据绑定的HTML被添加到DOM，然后JSON对象模型使用

The basic process is that the user uploads a file; the server then responds with a JSON object, the data-bound HTML is added to the DOM, then the JSON object model is bound to this HTML using

mn.AccountCreationModel = new AccountViewModel(jsonData.Account);
ko.applyBindings(mn.AccountCreationModel);

一旦用户对模型做出一些选择，同一个对象就会回发到服务器，然后从DOM中删除数据绑定的HTML，然后我有以下JS

Once the user has made some selections on the model, the same object is posted back to the server, the data-bound HTML is removed from then DOM, and I then have the following JS

mn.AccountCreationModel = null;

当用户希望再次执行此操作时，将重复所有这些步骤。

When the user wishes to do this once more, all these steps are repeated.

我担心代码过于参与jsFiddle演示。

I'm afraid the code is too 'involved' to do a jsFiddle demo.

推荐答案

<你有没有尝试在DOM元素上调用knockout的clean节点方法来处理内存绑定对象？

Have you tried calling knockout's clean node method on your DOM element to dispose of the in memory bound objects?

var element = $('#elementId')[0]; 
ko.cleanNode(element);

然后使用新视图模型再次对该元素应用knockout绑定将更新视图绑定。

Then applying the knockout bindings again on just that element with your new view models would update your view binding.

这篇关于如何在Knockout.js中清除/删除可观察的绑定？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！