Knockout JS - 在observableArray中修改項目的屬性

我試圖更新以紅色顯示的棕褐色以反映一個項目重新定位時每個項目在observableArray中的位置。你可以在這裏看到我目前的代碼：http://jsfiddle.net/BV87N/Knockout JS - 在observableArray中修改項目的屬性

這不像我期望的那樣行事。我有一種感覺，因爲數組內部的項目和它們的屬性本身是不可觀察的。

但我不太清楚如何讓這個工作。

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; 
    }; 
};

來源

2013-10-20 PercivalMcGullicuddy

聽起來像一個很好的初始假設。測試它通過使sortOrder可觀察，然後*更新*相同的可觀察。儘管使sortOrder成爲一個依賴於items可觀察數組的計算可觀察值可能更有意義。 – user2864740

這observable Arrays

關鍵點的文件中非常明確地指出：一個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。

旁註：但在你的情況下，你並不需要任何sortOrder屬性，因爲items中的項目順序是排序順序。因此，在綁定中，您只能使用$index（binding context屬性）而不是sortOrder。

演示JSFiddle。

來源

2013-10-20 22:09:31 nemesv

感謝nemesv，但我真正的問題來自這樣一個事實，在我的真實應用程序中，賦予observable數組的數據是來自ajax調用的JSON數組。所以我不能指定sortOrder屬性作爲第一個Demo中的可觀察值。這是Mapping插件可以用於什麼？ – PercivalMcGullicuddy

是的，這是Mapping插件支持這些用例的目標。在你的示例中，你只需要用'ko.mapping.fromJS'替換'ko.observableArray'，它就可以工作：http://jsfiddle.net/GDDxK/。因爲'ko.mapping.fromJS'將常規的JavaScript數組轉換爲可觀察數組，並遍歷每個項目並將屬性變爲'ko.obserable'對象。 – nemesv

Knockout JS - 在observableArray中修改項目的屬性

回答

相關問題