javascript - 使用 knockoutJS 时出现错误可见

Question

我使用knockoutJS，当我想要关闭 block div 或 h html 标签时出现错误。 我的 Javascript 代码发生错误:

function myModel(){
this.flags = false;
    this.getFlag = ko.computed(function(){
        if(this.flags == false){
            this.flags = true;
        }else{
            this.flags = false;
        }
        console.log(this.flags);
        return this.flags;
    });
}
ko.applyBindings(new myModel());

我的 HTML:

<button data-bind="click: getFlag">Click button</button>
<h3 data-bind="visible: getFlag()">test visible</h3>

当我单击按钮时，浏览器控制台中会显示以下消息:

false Uncaught Error: Cannot write a value to a ko.computed unless you specify a 'write' option. If you wish to read the current value, don't pass any parameters.knockout-3.3.0.js:44 gknockout-3.3.0.js:83 (anonymous function)

当我编写不带函数 ko.compulated() 的 javascript 代码时

    this.flags = false;
    this.getFlag = function(){
        if(this.flags == false){
            this.flags = true;
        }else{
            this.flags = false;
        }
        console.log(this.flags);   
        return this.flags;
    };

我在浏览器控制台中看到此消息:

正确

当我按下按钮时，我有 false 等 true false true false 但 visible 不起作用。 有什么问题吗？

Answer 1

所以首先你需要将你的属性声明为可观察的:

var self = this;
self.flag = ko.observable(false);

接下来我们将制作一个开关来来回切换标志:

self.toggleFlag = function(){
   self.flag(!self.flag());
}

现在您可以绑定(bind):

<button data-bind="click: toggleFlag">Click button</button>
<h3 data-bind="visible: flag">test visible</h3>