Knockout .js并在单击时更改值

Knockout .js and changing values on click

本文关键字：单击 js Knockout      更新时间：2023-09-26

简化代码如下。我有另一个构建w/ajax调用，我知道正在工作b/c，我可以看到它们击中服务器。但我无法让这些东西将更改呈现回UI。

. html: 

<div id="LoginPage" data-title="LoginPage" data-role="page" data-theme="a">
<div data-role="content" class="minimalPaddingContent">
    <div class="divDivider"></div>
    <h3>REACH Energy Audit Login</h3>
    <input type="text" placeholder="User Name" id="userName" data-bind="value: successOrFailureSw"/>
    <input type="password" placeholder="Password"  id="password"/>
    <a href="#" data-role="button" id="LoginSubmit" style="width:150px;" class="centeredButton" data-bind="click: changeValue">Sign In</a>
  <span data-bind="text: successOrFailureSw"></span>
</div>

. js: 

var LoginViewModel = function (commonName, successOrFailureSw) {
    var self = this;
    self.commonName = ko.observable(commonName);
    self.successOrFailureSw = ko.observable(successOrFailureSw);

    self.changeValue = function(){
        console.log("changed!");
        self.successOrFailureSw = "new value!";
    }
};
ko.applyBindings(new LoginViewModel("", "super fail"));

我很确定我的映射在.html b/c上是正确的，原始值将呈现为超级失败，如果我改变映射到"successOrFailureSw"的文本框中的值，我在span标签中得到更新的值，但我无法在登录按钮的点击时间得到效果的改变。

我知道我错过了一些这么简单的，所以我提前道歉。

谢谢!

布赖恩

你给可观察对象赋值的方式不对。每个可观察对象都是一个函数，所以你应该使用()来调用它，修改你的changeValue函数如下:

self.changeValue = function(){
    console.log("changed!");
    self.successOrFailureSw("new value!");
}

您应该这样设置值:

self.successOrFailureSw('new value!');

successOrFailureSw不是字符串。这就是为什么您需要以与前面代码相同的方式设置它的原因。

试试这个:自我。successOrFailureSw("新价值!")

相关文章：