简体   繁体   English

Knockout.js可观察对象绑定的可观察数组

[英]knockoutjs observable array of observable objects binding

I have an issue in that when I am adding a object containing observable properties to an observablearray the interface is not being updated. 我有一个问题,当我将包含可观察属性的对象添加到observablearray时,接口未更新。

I have studied similar questions on this forum ( KnockoutJS - Observable Array of Observable objects ) but I still cannot get the syntax correct, so after a day of trying I am turning to the expects for help please. 我在这个论坛上研究了类似的问题( KnockoutJS-Observable对象的Observable数组 ),但是我仍然无法正确获取语法,因此在尝试了一天之后,我转向期望帮助的人。

I have created an exmaple of what I am trying to achieve 我已经创建了我要实现的目标的典范

https://jsfiddle.net/ryrpnbr9/23/ https://jsfiddle.net/ryrpnbr9/23/

When you press the Add button a BatchItem object is created and is added to the BatchItems observablearray of Batch. 当您按下添加按钮时,将创建一个BatchItem对象,并将其添加到Batch的BatchItems observablearray中。 I can see that the object is being updated. 我可以看到该对象正在更新。

I have a table with the following binding defined 我有一个表,定义了以下绑定

<tbody data-bind="foreach: Batch.BatchItems()">
    <tr>
        <td><span data-bind="text: DocumentType"></span></td>
        <td><span data-bind="text: ItemType"></span></td>                            
    </tr>
</tbody>

Any help would be much appreciated. 任何帮助将非常感激。 Thanks 谢谢

Instead of self.Batch.BatchItems().push(bi); 代替self.Batch.BatchItems().push(bi); , you'll have to call self.Batch.BatchItems.push(bi); ,则必须调用self.Batch.BatchItems.push(bi);

The difference between the two: 两者之间的区别:

The first pushes directly to the array that is inside the observable array. 第一个直接推送到可观察数组内部的数组。 This works, but knockout won't be able to tell something's changed... 这行得通,但是淘汰赛将无法告诉您某些更改...

The second one uses the push method inside ko.observableArray . 第二个使用ko.observableArray内部的push方法。 This push method again pushes to the inner array, but it also calls valueHasMutated . push方法再次推入内部数组,但它也调用valueHasMutated This triggers the dependency updates required to update your models and UI. 这将触发更新模型和UI所需的依赖项更新。

Updated fiddle with the removed () 更新了小提琴 ,其中已删除()

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM