Question

我试图在事件触发时更新敲除模型中的值，或者更具体地说是在按钮单击后更新。我在更新部分时遇到了麻烦。

我已经简化了模型，直到我更好地掌握了如何使用淘汰赛，但基本上用户会对一个人进行查找/搜索，所选记录应该与他们选择的人一起更新以形成搜索结果

在这里的示例中，我尝试在单击表单上的按钮后在所选属性上设置属性管理器。单击触发我的setByCode函数，我打算更新模型中的值。（最终数据将来自json结果而不是现在的结果）

它没有为我更新所选属性。

HTML

<button data-bind='click: setByCode'>Update Selected Manager</button>
<div data-bind="with: selectedProperty"><h2>Selected: <span data-bind="text: addrSuburb"></span></h2>
</div>
<section>
    <article data-bind="foreach: properties">
        <button data-bind="click: $parent.selectedProperty" >SELECT</button>
        <input type="text" data-bind="value: addrLine1" />
        <input type="text" data-bind="value: addrSuburb" />
        <input type="text" data-bind="value: propertyManager" />
        <ul id="rentalAgreements" data-bind="foreach: rentalAgreements">
            <li>
                <input type="text" data-bind="value: weeklyRate" />
            </li>
        </ul>
    </article>
</section>
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>

视图模型

var initialData = [{
    addrLine1: ko.observable("1 Small St"),
    addrSuburb: ko.observable("Brisbane"),
    rentalAgreements: [{
        weeklyRate: ko.observable("200")
    }, {
        weeklyRate: ko.observable("210")
    }],
    propertyManager: ko.observable("")
}, {
    addrLine1: ko.observable("23 Another St"),
    addrSuburb: ko.observable("Ipswich"),
    rentalAgreements: [{
        weeklyRate: ko.observable("180")
    }],
    propertyManager: ko.observable("Property Manager 1")
}];

var PortfolioModel = function (properties) {
    var self = this;
    this.properties = ko.observableArray(
    ko.utils.arrayMap(properties,

    function (property) {
        return {
            addrLine1: property.addrLine1,
            addrSuburb: property.addrSuburb,
            rentalAgreements: ko.observableArray(property.rentalAgreements),
            propertyManager: property.propertyManager
        };
    }));

    self.selectedProperty = ko.observable();

    self.setByCode = function () {
        //var data = { "propertyManager": "Property Manager 2" };
        // will come from an ajax response
     self.selectedProperty.propertyManager = "Property Manager 2";
     //alert("update fired");   
    };
}

ko.applyBindings(new PortfolioModel(initialData));

Answer 1

您尚未澄清步骤。要在模型中使用 setByCode 函数中的一些更改。

self.setByCode = function () {
    //var data = { "propertyManager": "Property Manager 2" };
    // will be an ajax response
 self.selectedProperty().propertyManager("Property Manager 2");
 alert("update fired");   
};

由于 self.selectedProperty 是可观察的， propertyManager 也是可观察的，因此您无法通过点分配和调用。我们必须使用可观察的 getter 和 setter 函数。对于目前的情况 self.selectedProperty（）。propertyManager（“Property Manager 2”）;

Here is working Jsfiddle

Answer 2

http://jsfiddle.net/Wm893/4/

问题出在self.setByCode回调中。我改变了

self.selectedProperty.propertyManager = "Property Manager 2";

到

self.selectedProperty().propertyManager("Property Manager 2");

整个功能变为：

self.setByCode = function () {
    //var data = { "propertyManager": "Property Manager 2" };
    // will be an ajax response
 self.selectedProperty().propertyManager("Property Manager 2");
 alert("update fired");   
};

我所做的是在使用observables时添加括号，因此在selectedProperty之后，以及在propertyManager的赋值中。请记住，要更新observable的值，您需要使用函数语法进行分配，而不是直接赋值。获取'self.selectedProperty'的值也是如此。如果没有（），你就会得到可观察的。添加（）以获取当时的实际值。

Answer 3

由于selectedProperty和propertyManager是可观察的属性，您可以通过下一种方式设置propertyManager的值：

self.selectedProperty().propertyManager("Property Manager 2");

完整示例在这里http://jsfiddle.net/yaWJ7/2/

Knockout：通过代码手动更新observable？

3 个答案: