更新ObservableArray中的可觀察值knockoutjs

Question

我有一個observableArray和一個observable如下。

self.unreadcount = ko.observable(); 

self.searchFilters = ko.observableArray([ 
    {label: "A", active: ko.observable(false), count1: self.unreadcount()}, 
    {label: "B", active: ko.observable(false), count1: self.unreadcount()}, 
    {label: "C", active: ko.observable(false), count1: self.unreadcount()} 
]); 

在一個特定的功能，我已經過了一定的參考價值self.unreadcount（）， 我需要更新我的observableArray還我accordingly.How能做到嗎？

Answer 1

您可以使用self.unreadcount可觀察值來設置count1屬性。

self.searchFilters = ko.observableArray([ 
    {label: "A", active: ko.observable(false), count1: self.unreadcount}, 
    {label: "B", active: ko.observable(false), count1: self.unreadcount}, 
    {label: "C", active: ko.observable(false), count1: self.unreadcount} 
]); 

See fiddle

或者可以將綁定在count1屬性的$parent.unreadcount：

<div data-bind="foreach : searchFilters"> 
    <span data-bind="text : label"></span> 
    <span data-bind="text : $parent.unreadcount"></span> 
    <br/> 
</div> 

JS

var VM = function() { 
    var self = this; 
    self.unreadcount = ko.observable(); 

    self.searchFilters = ko.observableArray([ 
    {label: "A", active: ko.observable(false)}, 
    {label: "B", active: ko.observable(false)}, 
    {label: "C", active: ko.observable(false)} 
    ]); 
}; 

See fiddle

如果您需要手動更新count1;你可以這樣做：

self.searchFilters = ko.observableArray([ 
    {label: "A", active: ko.observable(false), count1: ko.observable(self.unreadcount())}, 
    {label: "B", active: ko.observable(false), count1: ko.observable(self.unreadcount())}, 
    {label: "C", active: ko.observable(false), count1: ko.observable(self.unreadcount())} 
]); 

self.update = function(newValue) { 
    ko.utils.arrayForEach(self.searchFilters(), function(row) { 
     row.count1(newValue); 
    }); 
} 

See fiddle

Answer 2

我不知道這是否是你所追求的，但我已經創建了一個的jsfiddle：http://jsfiddle.net/RFc3r/2/，它使用您的observableArray，並允許您更新每行計數。

標記：

<p data-bind="text: ko.toJSON(searchFilters)"></p> 
<div class="liveExample" data-bind="foreach: searchFilters"> 
    <p>Label:<input data-bind="value: label"></input></p> 
    <p>Active:<input type="checkbox" data-bind="checked: active"></input></p> 
    <p>Unread:<input data-bind="value: count1"></input></p> 
    <input type="button" data-bind="click: changeValue(count1)" value="click me"/> 
    <hr/> 
</div> 

JS：

var ViewModel = function() { 
    self.unreadcount = ko.observable(0); 

    self.searchFilters = ko.observableArray([{ 
     label: "A", 
     active: ko.observable(false), 
     count1: ko.observable(self.unreadcount()) 
    }, { 
     label: "B", 
     active: ko.observable(true), 
     count1: ko.observable(self.unreadcount()) 
    }, { 
     label: "C", 
     active: ko.observable(false), 
     count1: ko.observable(self.unreadcount()) 
    }]); 

    self.changeValue = function(item){ 
     item(item() + 1); 
    }; 
}; 

ko.applyBindings(new ViewModel());