knockout.js - 淘汰赛 JS 数据绑定不评估 javascript 表达式

Question

我有一组复选框来控制我的页面上一组项目的可见性。我正在尝试添加一些功能，以便当没有选中任何框时，所有项目都会显示出来。

我想我的第一个问题是，我可以像下面那样在数据绑定中使用逻辑运算符吗？从这里的文档（http://knockoutjs.com/documentation/binding-syntax.html）看来我应该能够做到。我试图避免为所有复选框创建一组额外的计算。如果这是可能的，我做错了什么？

<div data-bind="visible: (showStaff() || showAll())" class="procedure">

当我在 Chrome 中查看 KnockoutJS 检查器时，似乎只评估“showStaff()”，而不是表达式的其余部分。我也尝试了以下方法，因为我知道 showStaff() 和 showAP() 都有效。它仍然只评估了上半场。

<div data-bind="visible: (showStaff() || showAP())" class="procedure">

这是我的js：

var self = this;
self.showAP = ko.observable(true);
self.showTR = ko.observable(true);
self.showSR = ko.observable(true);
self.showStaff = ko.observable(true);
self.showNSW = ko.observable(true);
self.showGA = ko.observable(true);
self.showP14 = ko.observable(true);
self.showSW = ko.observable(true);
self.showAll = ko.computed(function () {
    var show;
    if (!self.showAP && !self.showTR && !self.showSR && !self.showStaff && !self.showNSW && !self.showGA && !self.showP14 && !self.showSW) {
        showAll = true;
        return show;
    }
    else {
        showAll = false;
        return show;
    }
});

Answer 1

你以错误的方式使用 observable。修改您的计算如下：

self.showAll = ko.computed(function () {
    var show;
    if (!self.showAP() && !self.showTR() && !self.showSR() && !self.showStaff() && !self.showNSW() && !self.showGA() && !self.showP14() && !self.showSW()) {
        show = true;
        return show;
    }
    else {
        show = false;
        return show;
    }
});

Answer 2

如果你想要一个 observable 的值，你应该添加 ()。

self.showAll = ko.computed(function () {
    var show;
    if (!self.showAP() && !self.showTR() && !self.showSR() && !self.showStaff() && !self.showNSW() && !self.showGA() && !self.showP14() && !self.showSW()) {
        showAll = true;
        return show;
    }
    else {
        showAll = false;
        return show;
    }
});