0

In one of my viewmodels I have a function Control that creates an objects later to be bound to the view:

(The code is only reproducing my viewmodel, therefore it may be incomplete or containing some mistakes. If you need more details please ask in a comment bellow. Since the example refers to durandaljs framework I cannot provide a JsFiddle.)

function Control ( value ) {
    var self = this;
    self.param = value;
    self.param1 = ko.observable(value.text());
    self.param2 = ko.computed(function() {
        read: function(){
            return getString(self.param.text()).StringValue();
        },
        write: function(newValue){
            stringsArray.push(
                {StringID: ko.observable(-1), StringValue: ko.observable(newValue)});
            self.param.text(-1);
        },
        owner: self
    });
    self.param3 = ko.computed(function() {
        return self.param2() + ' something_else';
    });
    self.param1.subscribe(function( newValue ) {
        if ( newValue ) {
            self.param3(newValue + 'text');
        }
    });

}

var controls = ko.observableArray([
    new Control({id: 1, text: ko.observable(2)}),
    new Control({id: 2, text: ko.observable(4)}),
    new Control({id: 2, text: ko.observable(1)})
]);

var stringsArray = ko.observableArray([
    {StringID: ko.observable(1), StringValue: ko.observable('aaa')},
    {StringID: ko.observable(2), StringValue: ko.observable('bbb')}
    {StringID: ko.observable(3), StringValue: ko.observable('ccc')}
    {StringID: ko.observable(4), StringValue: ko.observable('ddd')}
    {StringID: ko.observable(5), StringValue: ko.observable('eee')}
    {StringID: ko.observable(6), StringValue: ko.observable('fff')}
]); // data retrieved from the database

var deactivate = function() {
    controls.removeAll();
    stringsArray.removeAll();
};

var vm = {
    deactivate: deactivate,
    controls: controls,
    stringsArray: stringsArray
};
return vm;

function getString ( stringID ) {
    for ( var i = 0; i < stringsArray().length; i++ ) {
        if ( stringsArray()[i].StringID() === stringID ) {
            return stringsArray()[i];
        }
    }
    return undefined;
}

My problem is that the objects that are created from the function are scoped globally, therefore when I deactivate the viewmodel they still exist in memory.

How should I rewrite the function Control(value) so the objects that it creates will have the viewmodel scope. They will only exist when the viewmodel is active and discarded when I remove them from the observableArray in the deactivate method?

4

2 回答 2

0

有趣的例子,但我不确定上面的代码是否真正反映了你在做什么,或者它是否是一个复制/粘贴问题。

为了调试它,我在http://dfiddle.github.io/dFiddle-2.0/#extras/scope提出了一个 dFiddle 。随意分叉和修改。

目前,当您离开视图时deactivate,会触发 Durandal 的实时循环事件,该事件将从和removeAll进入,但当然至少在视图模型返回单例且 cacheViews 设置为 true 时将淘汰 observableArrays 留在内存中。stringArraycontrols

我很可能会将 vm 转换为构造函数,然后将控件移动到它自己的模块中,但当然不知道确切的要求,这只是一种直觉。

以下内容应该可以帮助您入门:

查看模型

define(['durandal/system', 'jquery', 'knockout', './control'], function( system, $, ko, Control ) {
    "use strict";

    var vm = function() {
        this.controls = ko.observableArray([
            new Control('value1'),
            new Control('value2'),
            new Control('value2')
        ]);
    };

    vm.prototype.deactivate = function() {
        this.controls.removeAll();
    };

    return vm;
});

控制模块

define(['knockout'], function(  ko ) {
    "use strict";

    function Control ( value ) {
        this.param = value;
        this.param1 = ko.observable(value.text);
        this.param2 = ko.computed(function() {
            //translate self.param.StringID with data from another
            //an observableArray containing data retrieved from the server
            //return getString(this.param.StringID()).StringValue();
            return 'Computed' + this.param.id;
        // ko.computed takes a context parameter
        }, this);
        this.param3 = ko.computed(function() {
            return this.param2() + 'something_else';
        }, this);
        this.param1.subscribe(function( newValue ) {
            if ( newValue ) {
                this.param3(newValue + 'text');
            }
        });
    }

    var stringsArray = ko.observableArray([]); // data retrieved from the database

    return Control;

    function getString ( stringID ) {
        for ( var i = 0; i < stringsArray().length; i++ ) {
            if ( stringsArray()[i].StringID === stringID ) {
                return stringsArray()[i];
            }
        }
        return undefined;
    }

});

现场版本可在http://dfiddle.github.io/dFiddle-2.0/#extras/scope/ctor

于 2013-10-15T10:22:04.880 回答
0

显然我的问题是ko.computed对象所包含的。当我停用视图模型时,计算并没有被删除,因为它们所依赖的一些外部数据仍在内存中。

我在这篇文章中找到了它:https ://groups.google.com/d/msg/knockoutjs/4HV_PgcBNXA/ozoyXlygJHwJ

在停用功能中手动处理后ko.computed,问题消失了。

于 2013-10-16T10:52:25.553 回答