Knockout.js：標籤元素的更新不反映在JSON源中

Question

我是knockout.JS的新手。我將JSON集合綁定到一個表。

<tbody data-bind="foreach: Collection"> 
      <tr> 
       <td> 
        <span data-bind="text: FirstName" ></span> 
       </td> 
       <td> 
        <span data-bind="text: LastName" ></span> 
       </td> 
       <td> 
        <input type="button" data-bind="click: function(){ obj.RemoveItem($data) }" value="Del" /> 
       </td> 
       <td> 
        <input type="button" data-bind="click: function(){ obj.SaveItems($data.Id) }" value="Edit/Save" /> 
       </td> 
      </tr> 
     </tbody> 

function viewModel(collection) { 
      var self = this; 
      this.Collection = ko.observableArray(collection); 
      this.AddItem = function() { 
       this.Collection.push({FirstName:"", LastName:""}); 
      }; 
      this.RemoveItem = function(data) { 
       this.Collection.remove(data); 
      }; 
      this.SaveItems = function(id) { 
       alert("New Collection: " + ko.utils.stringifyJson(self.Collection)); 
      } 
     }; 

     var obj = new viewModel([ 
      { Id: 1,FirstName: "John", LastName: "Saleth" }, 
      { Id: 2, FirstName: "John", LastName: "Kennedy" } 
     ]); 

     ko.applyBindings(obj); 

在eachrow，我一直一個編輯按鈕，點擊後，在所有TD與 跨度值插入一個文本框。保存點擊後，我正在用文本框的值更新span元素的值。

問題是span元素的新值是不是在JSON收集反映。如何使用更新的跨度值更新JSON源點擊保存按鈕？

Answer 1

應進行收集陣列觀察到的每個屬性爲好。

function ItemModel(item) { 
    this.Id = ko.observable(item.Id);  
    this.FirstName = ko.observable(item.FirstName); 
    this.LastName = ko.observable(item.LastName);  
}; 


function viewModel(collection) { 
    var self = this; 
    this.Collection = ko.observableArray(); 
    ko.utils.arrayForEach(collection, function (i) { self.Collection.push(new ItemModel(i)); }); 
    this.AddItem = function() { 
     this.Collection.push(new ItemModel({ 
      FirstName: "", 
      LastName: "" 
     })); 
    }; 
    ... 
};