knockoutjs foreachバインディング内のバインディングをクリック

Question

EDIT：問題はバインドに関連していませんが、単純なJavaScriptの誤りです。

私はforeachバインディング内のクリックバインディングに関する質問があります。 マスターデータから値を選択するためのドロップダウンボックスが表示されたリストがあります。アイテムはそのリストに追加したり削除したりすることができます。 アイテムを削除するボタンは、foreachバインディングでネストされています。したがって、私は$ parentとバインドする必要があります>

<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/

感謝。

Answer 1

あなたは1秒間私を持っていました！

あなたは正しく、$parentが必要です。あなたの間違いはあなたのビューモデルにselfを定義していませんでした。その後、$parentがremoveButtonと、masterDataバインディングに必要でした。 http://jsfiddle.net/FpSWb/