2012-06-05 104 views
7

編輯:問題與綁定無關,但對簡單的JavaScript錯誤。knockoutjs單擊綁定內部綁定

我有一個關於在一個foreach綁定內的點擊綁定的問題。 我有一個列表項,顯示一個下拉框從主數據中選擇一個值。項目可以添加並從該列表中刪除。 刪除項目的按鈕嵌套在foreach綁定中。因此,我預計我應該綁定它與$父>

<button data-bind="click: $parent.removeNumber">-</button> 

這是行不通的。但以下版本的作品:

<button data-bind="click: removeNumber">-</button> 

我不明白爲什麼。

代碼:

<h2>numbers:</h2> 
<ul data-bind="foreach: numbers"> 
    <li> 
     <select data-bind="value: id, 
          options: masterData, 
          optionsText: 'caption', 
          optionsValue: 'id'"></select> 
     <br /> 
     value: <span data-bind="text: id"></span> 
     <br /> 
     <button data-bind="click: $parent.removeNumber">-</button>  
    </li> 
</ul> 
<button data-bind="click: addNumber">+</button> 

function ViewModel() { 
    self.masterData = [{ id: 1, caption: "One"}, 
         { id: 2, caption: "Two"}]; 

    self.numbers = ko.observableArray([{ 
     id: ko.observable(2)}]); 

    self.addNumber = function() { 
     self.numbers.push({ 
      id: ko.observable(2) 
     }); 
    }; 


    self.removeNumber = function(item) { 
     self.numbers.destroy(item); 
     console.log("removed" + item); 
    }; 
} 

var viewModel = new ViewModel(); 
ko.applyBindings(viewModel);​ 

我創建了一個小提琴(與不工作的版本): http://jsfiddle.net/delixfe/NWWH8/

感謝您的幫助。

回答

8

你讓我一秒鐘!

你是對的,$parent應該是必需的。你的錯誤並沒有在你的視圖模型中定義self。完成後,$parent需要removeButton以及masterData綁定。

這裏是一個工作小提琴:http://jsfiddle.net/FpSWb/

+0

哦。太感謝了。 – delixfe

+0

jsfiddle無法正常工作 – Zypps987