Question

function AppViewModel() {
self.tagbuttons=ko.observableArray([
    {shotbar:false, frozendrinks: false, livemusic: false, patio:false, food:false}
    ]);

self.toggleTag = function(data,event) {
    var id = event.target.id;

    self.tagbuttons()[0][id] = !self.tagbuttons()[0][id];
    console.log(self.tagbuttons()[0][id]);
    if(self.tagbuttons()[0][id] == true)
    {
        $(event.target).closest('li').addClass("active");
        console.log(event.target.id+":"+"active");
    }
    else
    {
        $(event.target).closest('li').removeClass("active");
        console.log(event.target.id+":"+"inactive");}
    }
}

ko.applyBindings(new AppViewModel());

我的console.log（self.tagbuttons（）[0] [id]）输出正确的bool值，但该值在我的数组中没有更新。这是我的HTML：

 <div data-bind="text: tagbuttons()[0].shotbar"></di>

Answer 1

在声明MyAppViewModel之后以及加载UI之后，您需要应用KO绑定：

$(document).ready(function(){
    ko.ApplyBindings(new MyAppViewModel())?  
});

除非您正在应用KO绑定，否则视图模型之外不会发生任何事情。

Answer 2

以下是ko文档的引用：

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

简单地将一个对象放入一个observableArray并不是全部   该对象的属性本身是可观察的。当然可以   如果你愿意，可以观察这些属性，但那是一个   独立选择。 observableArray只跟踪它的对象   保持，并在添加或删除对象时通知侦听器。

因此，当您更改数组项时，不会通知值挖出。您可以使用valueHasMutated功能手动通知订阅者：

self.tagbuttons()[0][id] = !self.tagbuttons()[0][id];
self.tagbuttons.valueHasMutated();

或者使用observalbe包装数组：

self.tagbuttons = ko.observableArray([
ko.observable({
    shotbar:false, 
    frozendrinks: false, 
    livemusic: false, 
    patio:false, 
    food:false})
    ]);

我的可观察数组没有更新，我这样做是否正确？

2 个答案: