Javascript Knockout.js-删除特定实例的所有全局视图模型；“类型”；

我有一个MVC4应用程序，其中我通过ajax检索部分视图，并将响应html注入页面上的div中

每个局部视图中都有一个脚本部分，该部分实例化一个淘汰视图模型，然后将该视图模型绑定到局部视图上的一个div

我注意到，每次请求局部视图时，先前请求的视图模型的一个实例都会留在内存中。理想情况下，我希望留在内存中的唯一视图模型是绑定到刚才请求的部分视图的视图模型

以下是我用来获取局部视图的方法：

getFoo: function () {
    $.get('Home/Foo', null, function (data) {
        ko.cleanNode($('#contentDiv')[0]);
        $('#contentDiv').html(data);
    });
},
getBar: function () {
    $.get('Home/Bar', null, function (data) {
        ko.cleanNode($('#contentDiv')[0]);
        $('#contentDiv').html(data);
    });
}

以下是部分视图：

getFoo: function () {
    $.get('Home/Foo', null, function (data) {
        ko.cleanNode($('#contentDiv')[0]);
        $('#contentDiv').html(data);
    });
},
getBar: function () {
    $.get('Home/Bar', null, function (data) {
        ko.cleanNode($('#contentDiv')[0]);
        $('#contentDiv').html(data);
    });
}

富景

条形图模型

在添加

ko.cleanNode

之前，每个视图模型的实例数随每个请求增加一个。添加

ko.cleanNode

使应用程序只挂起每个视图模型的一个实例，但理想情况下，内存中唯一的视图模型将是在部分视图请求中带回的视图模型

---

有人知道我如何摆脱以前的视图模型实例，它似乎要挂在内存中？

我猜这段代码是您真实代码的一个极其简化的版本，但我想知道“删除窗口['FooViewModel']”行。您是要删除视图模型的定义还是视图模型的实例？这是正确的。我的实际项目要复杂得多，所以我创建了一个老生常谈的例子，看看我是否能看到这种行为被复制，而且确实如此。我已经删除了“删除窗口[“FooViewModel”]”，因为正如您所说，我不想完全删除该定义。我在您发布的代码中没有看到任何尖叫“内存泄漏”的内容，但可能还有其他引用。你能在一个JSFIDLE中复制它并把它和你的问题一起发布吗？我会说这是一个不寻常的模式。更常见的模式是使用web服务或WebAPI之类的东西返回JSON数据，并使用该数据更新客户端淘汰模型。然后knockout将自动更新您的视图，而无需从服务器发送更多HTML（或查找内存泄漏）。我可能误读了您的OP。我读它是为了说您在每次AJAX调用中加载HTML、ko视图模型和数据。我想说的是，使用knockout，您只需加载html模板和视图模型一次，然后只加载后续调用中的数据，并将其映射到内存中的模型，以便knockout可以为您更新html。在SPA中，我倾向于使用像requirejs或Durandal JS这样的AMD加载器。无论如何，我希望你能找到你的漏洞！

<script type="text/javascript">
$(function () {
    var barViewModel = new BarViewModel();
    ko.applyBindings(barViewModel, $('#barDiv')[0]);
});
</script>

<div id="barDiv">
    <div data-bind="text:name"></div>
</div>

function FooViewModel() {
this.name = ko.observable('FOO HERE');
}
_.extend(FooViewModel.prototype, {
    fooEvent: function () {
        console.log('foo event fired');
    }
});

function BarViewModel() {
this.name = ko.observable('BAR HERE');
}
_.extend(BarViewModel.prototype, {
    barEvent: function () {
        console.log('bar event fired');
    }
});