Knockout嵌套的observableArray没有绑定

Question

我已经看到了一些相似的问题上的相关搜索，但它无关紧要我试图匹配的工作结果我似乎无法弄清楚下面的代码有什么问题。

<div data-bind="foreach: collections" > 
    <div data-bind="text:name,click: $data.AddToCollectionB"> 
     <div data-bind="foreach: collectionB" > 
     <input type="text" data-bind="value: name"> 
     </div>     
    </div> 
</div> 

var kt = kt || {}; 

kt.itemA= function(n) { 
    var self = this; 
    self.name = n.name; 
    self.collectionB = ko.observableArray(n.colB); 

    self.AddToCollectionB = function() { 
    self.collectionB.push(kt.itemB({ name: 'test-nested sub item' })); 
    alert(self.name); 
    alert(self.collectionB().length); 
    }; 
}; 

kt.itemB= function(n) { 
    var self = this; 
    self.name = ko.observable(n.name); 
}; 

kt.vm= new (function() { 
    var self = this; 
    self.collections= ko.observableArray([new kt.itemA({name:'item 1', colB: [new kt.itemB({name:'sub-item'})]}),new kt.itemA({name:'item 2', colB: []})]); 
}); 

ko.applyBindings(kt.vm); 

请问谁能指出我做错了什么？

的jsfiddle链接：http://jsfiddle.net/L7uxh/31/

感谢，

Answer 1

当您在主div有text: name，它则会覆盖它里面的内容。

您需要做的是这样把name在span内的div，如：http://jsfiddle.net/rniemeyer/L7uxh/44/