Knockout.js 视图未更新-缺少css类

当我按下“更新”按钮时，我看到警报具有正确的值（真/假），但类“完成”不会被应用。 为什么视图不更新

<div data-bind="foreach: steps">
    <div data-bind="css: {done: complete}">
        <span data-bind="text: name"></span>
        <button data-bind="click: updateStatus">Update</button>
    </div>
</div>

var viewModel = function() {
    var self = this;
    self.steps = ko.observableArray();

    loadTestData(testDataSteps);
    function loadTestData(stepsArray) {
        $.each( stepsArray, function( index, value ){
            self.steps.push(new Step(value.id, value.name, value.step))
        });
    }
}

var Step = function (id, name, step){
    var self = this;
    self.id = ko.observable(id);
    self.name = ko.observable(name);
    self.step = ko.observable(step);
    self.complete = ko.observable(false);

    self.updateStatus = function () {
        if(self.complete === true) {
            alert("true")
            self.complete = false;
        }else {
            alert("false")
            self.complete = true;
        }
    };
;

更新
var viewModel=函数（）{
var self=这个；
self.steps=ko.observearray（）；
loadTestData（testDataSteps）；
函数loadTestData（stepsArray）{
$.each（步骤数组、函数（索引、值）{
self.steps.push（新步骤（value.id、value.name、value.Step））
});
}
}
var Step=函数（id、名称、步骤）{
var self=这个；
self.id=ko.可观察（id）；
self.name=ko.observable（名称）；
self.step=ko.可观察（step）；
self.complete=ko.可观察（假）；
self.updateStatus=函数（）{
if（self.complete==true）{
警惕（“真实”）
self.complete=false；
}否则{
警报（“假”）
self.complete=true；
}
};
;

更改getter和setter方法

var Step=函数（id、名称、步骤）{
var self=这个；
self.id=ko.可观察（id）；
self.name=ko.observable（名称）；
self.step=ko.可观察（step）；
self.complete=ko.可观察（假）；
self.updateStatus=函数（）{
if（self.complete（）==true）{//getter
警惕（“真实”）
self.complete（false）；//setter
}否则{
警报（“假”）
self.complete（true）；//setter
}
};
}
var viewModel=函数（）{
var self=这个；
self.steps=ko.observearray（）；
self.steps.push（新步骤（'ID'，'TEST'，'TEST'）；
回归自我；
}
ko.applyBindings（newviewmodel（））；

更新