無法解析綁定。淘汰賽錯誤

Question

這是我第2天的學習淘汰賽。

嘗試爲按鈕單擊附加「deleteItem」。它給出了以下錯誤。

Error

Uncaught Error: Unable to parse bindings.
Message: ReferenceError: deleteItem is not defined; Bindings value: click: deleteItem

的JavaScript：

$(function() { 
    var defaultData = [{ 
     id: 1, 
     item: "Todo 1" 
    }, { 
     id: 2, 
     item: "Todo 2" 
    }, { 
     id: 3, 
     item: "Todo 3" 
    }]; 
    var viewModel = { 
     listItem: ko.observableArray(defaultData), 
     addItem: function() { 
      // Add new item 
      var id = this.listItem().length + 1; 
      this.listItem.push({ 
       id: id, 
       item: "Todo " + id 
      }); 
     }, 
     deleteItem: function() { 
      alert(this); 
     } 
    } 
    ko.applyBindings(viewModel, main); 
}); 

HTML：

<div id="main"> 
    <button data-bind="click: addItem">+ Add Item</button> 
    <div data-bind="foreach: listItem"> 
     <input type="text" data-bind="value: item" /> 
     <input type="button" data-bind="click: deleteItem" /> 
     <br /> 
    </div> 
</div> 

Answer 1

功能deleteItem是您的視圖模型。當綁定在foreach內時，綁定操作的上下文是listItem陣列中的單個item。您需要綁定到$root.deleteItem以引用根視圖模型。