javascript - 编辑不适用于新添加的数据 - knockout

Question

我一直在关注一些教程并尝试遵循 knockout.js。我无法编辑任何新添加的数据。

我的 JS 代码:

var data = [
new ListData("Programmer", 1),
new ListData("Testing", 2),
new ListData("DBA", 3),
new ListData("Lead", 4),
new ListData("Manager", 5)
];


function ListData(desig, id) {
    return {
        Desig: ko.observable(desig),
        Id: ko.observable(id)

    };
}
var viewModel = {
    list: ko.observableArray(data),
    dataToAdd: ko.observable(""),
    selectedData: ko.observable(null),

    addTag: function () {
        this.list.push({ Desig: this.dataToAdd() });
        this.tagToAdd("");
    },

    selecData: function () {
        viewModel.selectedData(this);
    }
};

$(document).on("click", ".editData", function () {
});

ko.applyBindings(viewModel);

我的查看代码:

    <input type="text" data-bind="value:   dataToAdd" />
    <button data-bind="click: addData">
        + Add
    </button>
    <ul data-bind="foreach: list">
        <li data-bind="click: $parent.selecData">
            <span data-bind="text: Desig"></span>
            <div>
                <a href="#" class="editData">Edit</a> 
            </div>
        </li>
    </ul>
<div id="EditData" data-bind="with: selectedData">
    Designation:
    <input type="text" data-bind="value: Desig" />
</div>

我能够编辑已经存在的数据，例如程序员、测试、DBA...但是如果我添加新数据..我将无法编辑。请帮忙。

Answer 1

您的 addData (您在代码中将其命名为 addTag，但在 HTML 中调用 addData)函数不会构造新元素与您最初创建数据的方式相同。注意:由于您的 ListData 构造函数显式返回一个对象，因此 new 是多余的。

addData: function () {
    this.list.push(ListData(this.dataToAdd(), ""));
},