업데이트 ObservableArray - Knockout.js

Question

http://jsfiddle.net/kcFpS/5/

각 행에는 '편집'버튼이 있습니다. 이것을 클릭하면

1. 표 아래의 해당 텍스트 상자에있는 행 값을 채워야합니다. 예 : 'productName'이 txtName 등을 기입합니다.

2. 텍스트 상자의 텍스트를 편집하면 테이블의 변경 내용이 반영됩니다.

그러나. 코드가 작동하지 않습니다.

<td> 
    <button data-bind="click: $parent.editProduct">Edit</button> 
</td> 

function Product(Name,Qty) { 
      pname = ko.observable(Name); 
      qty = ko.observable(Qty); 
     } 

     var ViewModel = function() { 
      var self = this; 
      self.products = ko.observableArray([{ pname: 'Mobile', qty: 5 }, 
              { pname: 'Car', qty: 1}]); 

      self.SelectedItem = ko.observable(new Product());     

      self.editProduct = function (item) { 
       self.SelectedItem(item); 
      }; 
}; 

     ko.applyBindings(new ViewModel()); 

Answer 1

질문을 올바르게 이해하면. 데이터 배열 편집을 구현해야합니다.

var ViewModel = function() { 
var $scope = this; 

$scope.array = ko.observableArray([]); 
$scope.array.push({ name: ko.observable('Ben'), lastName: ko.observable('Afleck'), editMode: ko.observable(false) }); 
$scope.array.push({ name: ko.observable('Tom'), lastName: ko.observable('Cruse'), editMode: ko.observable(false) }); 

$scope.toggleEdit = function(data) { 
if (data.editMode()) { 
data.editMode(false); 
console.log(data.name()); 
console.log(data.lastName()); 
} 
else 
data.editMode(true); 
}; 
return $scope; 
}; 
var vm = new ViewModel(); 
ko.applyBindings(vm); 

http://jsfiddle.net/9X3er