如何使用 Knockout 为新创建的项目设置 id

Question

问题是我无法更新新创建的项目，因为在服务器上我没有收到任何 ID。

我正在尝试学习 Knockout，但我无法找到将 ID 提供给新创建的项目的方法。

我有一个带有 Id 和 Name 的对象，使用敲除我可以进行所有 Crud 操作，但是，在插入新项目后，如果我尝试更改他的名称，我将无法更改，因为该项目没有 Id 值。

我的问题是：每次添加新项目时，我都需要将新的项目集合返回到视图中，然后重新绑定视图？

或者，是否有另一种方法可以将 ID 提供给新插入的项目？

这是我的代码：

function Person(id, name) {
    var self = this;
    self.Id = ko.observable(id);
    self.nume = ko.observable(name);


}

function PersonVm() {
    var self = this;



self.Persons = ko.observableArray([]);


self.newPerson = ko.observable(new Person())
self.isModificare = false;

self.addPerson = function () {

    if (!self.isModificare) {
        $.ajax("/Person/AddPerson", {
            data: ko.toJSON({ Person: self.newPerson }),
            type: "post", contentType: "application/json",
            success: function (result) { alert(result.mesaj); }
        });
    } else {
        $.ajax("/Person/UpdatePerson", {
            data: ko.toJSON({ Person: self.newPerson }),
            type: "post", contentType: "application/json",
            success: function (result) { alert(result) }
        });
    }
    self.isModificare = false;


    if (!self.isModificare) self.Persons.unshift(self.newPerson());
    self.newPerson(new Person());


}
self.removePerson = function () {
    $.ajax("/Person/DeletePerson", {
        data: ko.toJSON({ Person: self.newPerson }),
        type: "post", contentType: "application/json",
        success: function (result) { alert(result) }
    });
    self.Persons.remove(self.newPerson());
    self.newPerson(new Person());


}

self.ModificaPerson = function (person) {        
    self.newPerson(person);
    self.isModificare = true;

}

$.getJSON("/Person/GetPersons", function (allData) {
    var mapPerson = $.map(allData, function (item) { return new Person(item.Id,item.Name) });
    self.Persons(mapPerson);
});
}

ko.applyBindings(new PersonVm());

编辑：

这是视图：

 <div class="input-group">

        <input type="text" class="form-control" data-bind="value: newPerson().name">
        <span class="input-group-btn">
            <button class="btn btn-default" data-bind="click:addPerson">
               <span class="glyphicon glyphicon-plus-sign" style="color:green"></span>
            </button>
        </span>
        <span class="input-group-btn">
            <button class="btn btn-default" data-bind="click:$root.removePerson">
                <span class="glyphicon glyphicon-trash" style="color:red"></span>
            </button>
        </span>
    </div>



 <ul data-bind="foreach: Perons" class="list-group" id="content">
    <li class="list-group-item"  data-bind="text: name,click:$root.ModificaPerson"></li>
</ul>

Answer 1

两步得到你想要的：

1. 确保您的“Person/AddPerson”Web 服务返回所创建对象的 ID。

2. 更改您的更新方法，以便在 newPerson 属性上设置一个 ID：

   $.ajax("/Person/AddPerson", {
       data: ko.toJSON({ Person: self.newPerson }),
       type: "post", contentType: "application/json",
       success: function (result) {
           self.newPerson().Id(result.Id);
       }
   });
   

请注意，上面的代码假设您的服务返回一个带有名为“Id”的 ID 属性的 JSON 对象。