2012-06-05 67 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