0

我有一个 MVC 4 应用程序，我在其中通过 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);
    });
}

以下是部分观点：

福景 

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

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

酒吧视图

<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>

以下是视图模型：

FOO 视图模型

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');
    }
});

在添加ko.cleanNode每个视图模型的实例数之前，每个请求都会增加一。添加ko.cleanNode使应用程序仅挂在每个视图模型的一个实例上，但理想情况下，内存中唯一的视图模型将是在部分视图请求中返回的视图模型。

有谁知道我怎样才能摆脱以前似乎想留在内存中的视图模型实例？

4

0 回答 0