Question

当我尝试访问新创建的元素的值时，我将函数体作为变量值。

点击“添加姓名”
在新添加的行中输入名字“Kate”。
点击“显示所有名称”按钮。

在弹出窗口中，显示函数体而不是“Kate”。我可以使用name.FirstName使用第一个元素，使用name.FirstName()使用其余元素。

在这种情况下（跨循环迭代）是否有任何一致的方法来获取FirstName的值？

我的HTML代码是：

    <table>
    <tbody data-bind="foreach: names">
        <tr>
            <td>
                <label>First Name:</label>
            </td>
            <td>
                <input data-bind="value: FirstName" type="text">
            </td>
            <td>
                <label>Last Name:</label>
            </td>
            <td>
                <input data-bind="value: LastName" type="text">
            </td>
        </tr>
    </tbody>
</table>
<button data-bind="click: addName">Add Name</button>
<button data-bind="click: showAllNames">Show All Names</button>

Javascript代码：

var namesArray = [{
    "FirstName": "Tom",
        "LastName": "Langdon"
}];

var ViewModel = function () {
    var self = this;
    self.names = ko.observableArray(namesArray);

    self.CreateBlankName = function () {
        return {
            FirstName: ko.observable(""),
            LastName: ko.observable("")
        };
    };

    self.addName = function () {
        names.push(CreateBlankName());
    };

    self.showAllNames = function () {
        var namestring = "";
        ko.utils.arrayForEach(self.names(), function (name) {
            namestring += name.FirstName + "\n";
        });
        alert(namestring);
    };
};

ko.applyBindings(ViewModel);

Answer 1

fisrtname和lastName字段应该是可观察的，因为您可以通过用户界面进行更改。

所以你需要把它们变成ko.observables，如下所示：

var namesArray = [{
    "FirstName": ko.observable("Tom"),
    "LastName": ko.observable("Langdon")
}];

现在物品只有可观察物品。这就是您需要更改showAllNames功能的原因：

ko.utils.arrayForEach(self.names(), function (name) {
    namestring += name.FirstName() + "\n";
});

See fiddle

您还可以使用ko.mapping.fromJS函数

自动将原始js对象转换为observables对象

Knockout - 变量值包含函数体

1 个答案: