Question

当用户点击按钮并且服务器正在处理某些数据时，我想使用knockout.js禁用按钮。我在淘汰赛教程中看example，但似乎遗漏了什么。

我在enable:中有data-bind部分：

<body>
    <form id="form1" runat="server" >
    <h1 style="text-align: center">Select the item(s) you want.</h1>
        <br />
        <br />
        <div id="buttons" style="text-align: center">
            <button data-inline="true" data-bind="click: submit, enable: canSubmit" >Submit</button>
            <button data-inline="true" data-bind="click: cancel">Cancel</button>
        </div>

我在视图模型中将observable设置为false。但是，按钮是初始化视图时在页面上启用。所以我认为这是一个数据绑定问题。

function ViewModel() {
    var self = this;
    self.selectedItems = ko.observableArray([]);
    // we should start off not being able to click the submit button
    self.canSubmit = ko.observable(false);
};

我想启用该按钮，直到用户点击提交按钮，然后禁用它，直到服务器完成它为止。

self.submit = function () {
        // disable submit button
        self.canSubmit = false;
        // do stuff
        self.canSubmit = true;
};

如何将enable可观察值绑定到按钮？

Answer 1

你错误地用直接的js变量替换了你的observable。 canSubmit是一个可观察的，所以通过调用函数来改变它的值：

self.submit = function () {
        // disable submit button
        self.canSubmit(false);
        // do stuff
        self.canSubmit(true);
};

剩下的就好了。

Answer 2

您没有更新您的可观察值，您正在更改self.canSubmit的引用，因此它指向一个布尔值。

将self.submit函数更改为：

self.submit = function () {
        // disable submit button
        self.canSubmit(false);
        // do stuff
        self.canSubmit(true);
};

如何使用knockout.js启用或禁用按钮

2 个答案: