Knockout JS - 修改observableArray中项目的属性

Question

我正在尝试更新红色显示的棕色,以便在重新定位一个项目时反映observableArray中每个项目的位置.您可以在此处查看我当前的代码:http://jsfiddle.net/BV87N/

它的行为并不像我期望的那样.我有一种感觉,因为数组中的项目及其属性本身是不可观察的.

但我不太清楚如何让它发挥作用.

   ko.bindingHandlers.sortable.afterMove = function () {
    self.adjustOrder();
};

self.adjustOrder = function () {
    for (var i = 0, j = self.items().length; i < j; i++) {
        self.items()[i].sortOrder = i;
    };
};

Answer 1

在可观察数组的文档中非常明确地说明了这一点

关键点:observableArray跟踪数组中的对象,而不是这些对象的状态

简单地将对象放入observableArray并不会使该对象的所有属性本身都可观察到.当然,如果您愿意,您可以观察这些属性,但这是一个独立的选择.

所以你需要创建你的sortOrder属性ko.observable()(有一个名为Knockout Mapping的插件可以帮助你),然后改变你adjustOrder的

self.adjustOrder = function () {
    for (var i = 0, j = self.items().length; i < j; i++) {
        self.items()[i].sortOrder(i);
    };
};

演示JSFiddle.

SideNote:但在你的情况下,你并不需要任何sortOrder属性,因为其中的项目items顺序是排序顺序.因此,在绑定中,您可以使用just $index(绑定上下文属性)而不是sortOrder.

演示JSFiddle.