如何在Knockout JS中完全从视图模型中删除子对象?

时间:2012-09-26 12:33:53

标签: knockout.js

我有以下设置:

http://jsfiddle.net/josephbulger/FjmAU/

我有一个KOJS视图模型,它具有父子关系。是什么让这种关系有点奇怪,是因为孩子需要父母才能执行其中一个计算函数。

这会给我带来各种各样的问题,因为当我调用一个save时,我必须重新加载所有的孩子,只要父的observable被更改,旧的孩子仍然会触发他们的计算函数。

这不是我想要的行为。我想做的是在保存之前完全删除所有孩子,然后从服务器回调中添加孩子。我的意思是,旧的孩子将完全从记忆中消失,他们不会再发动任何事件了。但是,我不知道如何用KOJS正确地清理它们。我此时唯一知道如何正确执行的操作是将它们从父项的子列表中删除。

在KOJS视图模型中完全处理子对象的正确方法是什么?

2 个答案:

答案 0 :(得分:0)

您可以使用ko函数:ko.removeNode(node)调用ko.cleanNode(node),然后从父节点中删除子项。

答案 1 :(得分:0)

作为一种解决方法,我不得不求助于此,尽管我真的不希望这是解决方案:

function Parent() {
    var self = this;

    self.children = ko.observableArray([]);

    self.troublemaker = ko.observable(5);    

    self.blowaway = function () {

        //i have to do this so i can serialize later
        for (var i = 0; i < self.children().length; i++) {    
            self.children()[i].alive = false;                        
            self.children()[i].parent = null;
        }

        var dataToServer = ko.toJSON(self);

        //save to server

        self.children.removeAll();

        makeChildren();

    }

    function makeChildren(){
        self.children.push(new Child(self));     
        self.children.push(new Child(self));     
        self.children.push(new Child(self));                         
    }     

    makeChildren();

}

var count = 0;

function Child(parent) {

    var self = this;

    self.parent = parent;

    self.alive = true;

    self.something = ko.observable(10 * count);

    count++;

    self.iwillblowup = ko.computed(function () {      
        if (!self.alive)
            return;
        return self.something () * self.parent.troublemaker();
    });        
}

var viewModel = new Parent();
ko.applyBindings(viewModel);​

注意“alive”标志是如何用于有条件地离开计算函数的。对我来说,这只是解决我遇到的根本问题的一个黑客。