当儿童可观察到的更新时，淘汰赛js css似乎没有重新计算

debugcn 发表于 Dev

事物

我对Knockout相当陌生，我想尽一切办法观察可观察物和计算可观察物。

更新：JS Fiddle：http : //jsfiddle.net/tQ576/4/带有运行但损坏的示例。当在输入框中输入内容时，Label的标签应变为绿色。

我有一个像这样的模型：

var json = {
    name: 'Testing',
    items: [{
        question: 'Question 1',
        answer: '',
        isrequired: true,
        isvisible: true,
        complexObject: {
            FirstName: '',
            LastName: '',
            Email: ''
        }
    }, {
        question: 'Question 2',
        answer: '',
        isrequired: true,
        isvisible: true,
        complexObject: {
            FirstName: '',
            LastName: '',
            Email: ''
        }
    }]
};

var ViewModel = function () {
    var self = this;
    self.profile = ko.observable(new Profile(json));
};

var Profile = function (init) {
    var self = this;
    self.name = ko.observable(init.name);
    self.items = ko.observableArray([]);
    for (var i = 0; i < init.items.length; i++) {
        self.items.push(new ProfileItem(init.items[i]));
    }
};

var ComplexObject = function () {
    var self = this;
    self.name = ko.observable("");
    self.email = ko.observable("");
}

var ProfileItem = function (item) {
    var self = this;
    self.question = ko.observable(item.question);
    self.answer = ko.observable(item.answer);
    self.complexObject = ko.observable(new ComplexObject());
    self.isvisible = ko.observable(item.isvisible);
    self.isrequired = item.isrequired;
    self.cssclasses = ko.computed(function () {
        if (self.complexObject().Email != undefined && self.complexObject().Email().length > 0) {
            return "satisfied";
        } else {
            return "required";
        }
    });
};

ko.applyBindings(new ViewModel());

然后在我的html中，我有这样的模板：

<div data-bind="foreach: profile().items">
    <div data-bind="css: cssclasses">
        <span data-bind="text: question"></span><br />
        <div data-bind="with: complexObject">
            <input data-bind="value: email" />
        </div>
    </div>
</div>
<div data-bind="text: ko.toJSON($root)"></div>

似乎当为“电子邮件”更新值时，cssclasses的计算值将永远不会重新计算。有办法强制重新计算吗？

最好的问候，并感谢大家的帮助。

JS小提琴：http：//jsfiddle.net/tQ576/4/

事物

第45章

如果您email在计算中没有大写字母，它将起作用。见小提琴

更改self.complexObject().Email !== undefined && self.complexObject().Email().length > 0)为self.complexObject().email !== undefined && self.complexObject().email().length > 0)-因为这就是您在视图模型和数据绑定中拥有它的方式。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。