Knockoutjs更新孩子，当父母的可观察到的变化

问题描述：

当父可观察性使用KnockoutJs更改时，如何触发子元素的更新？Knockoutjs更新孩子，当父母的可观察到的变化

在我的应用程序中，我正在构建一个翻译工具。我有一个代表一些文本的原始（默认）值淘汰赛类，有翻译儿童的集合：

function ParentObject(id, defaultValue) { 
    var self = this; 

    self.id = id; 
    self.defaultValue = ko.observable(defaultValue); 

    self.children = ko.observableArray(); 

    self.loadChildren = function() { 
     // standard code to load the children ("lazy load", as I have gobs of data) 
    } 
}

而且孩子

function Child(id, translation, cultureCode) { 
    var self = this; 

    self.id = id; 
    self.cultureCode = cultureCode; 
    self.translation= ko.observable(translation); 
}

父项的默认值属性绑定到一个输入控件。

当我更新父项的默认值时，我想要为每个孩子调用我的翻译服务。但我对于如何着手有点失落。

如何识别父母的“defaultValue”属性已更改？
当发生时，我是否应该迭代父代中的孩子，或者以某种方式将其移动到孩子身上？

（请注意，我的例子是从真正的实现简化）

编辑：加入这一个功能沿着我的默认值元素，还通过旧值：

data-bind=" value: defaultValue, event: {change: updateChildren}"

哪里updateChildren迭代子数组。

答

这里是一个工作示例： JsFiddle

function ParentObject(id, defaultValue) { 
    var self = this; 

    self.id = id; 

    self.defaultValue = ko.observable(defaultValue); 

    self.defaultValue.subscribe(function(newValue){ 
     ko.utils.arrayForEach(self.children(), function(child) { 
      alert(child.id); 
     }); 
     console.log(newValue); 
    }); 

    self.children = ko.observableArray(); 

    self.loadChildren = function() { 
     // standard code to load the children ("lazy load", as I have gobs of data) 
    } 
} 

function Child(id, translation, cultureCode) { 
    var self = this; 

    self.id = id; 
    self.cultureCode = cultureCode; 
    self.translation= ko.observable(translation); 
} 


var vm = function() { 
    var self = this; 
    self.parent = new ParentObject(1,10); 
    self.parent.children.push(new Child(1,"A","1A")); 
    self.parent.children.push(new Child(2,"B","2B")); 
    self.parent.children.push(new Child(3,"C","3C")); 
} 

var viewModel = new vm(); 

ko.applyBindings(viewModel);

您可以使用订阅功能收听观察的变化：

self.defaultValue.subscribe(function(newValue){ 
     ko.utils.arrayForEach(self.children(), function(child) { 
      alert(child.id); 
     }); 
     console.log(newValue); 
    });

我明白你要去那里了，我喜欢小提琴的结果。我只是没有看到我的应用程序中订阅的事件触发。 – reallyJim 2012-08-02 20:01:05

答

如果你把一个参考家长对儿童，你应该能够做这样的事情..

parent.defaultValue.subscribe(function(newValue){ 
    //do something on child with newValue 
});

总的想法是在解释“扩展” http://knockoutjs.com/documentation/extenders.html

Knockoutjs更新孩子，当父母的可观察到的变化

相关推荐