单击foreach中的父函数绑定

Question

我有以下html:

<div data-bind="foreach: Contacts">
   <a data-bind="click: $parent.Foo($data), text: Name">link</a>
</div>
<button data-bind="click: AddContacts">click</button>

和js代码:

var viewModel = ko.mapping.fromJS({"Selected":null,"Contacts":[]});
viewModel.AddContacts = function(){
    this.Contacts([{"Name":"C1"},{"Name":"C2"}]);
}

viewModel.Foo = function (contact) {
    alert(contact.Name);
}

ko.applyBindings(viewModel);

当我单击按钮时,会为每个联系人调用Foo.在点击任何链接之前,我根本没想到会调用它.

Answer 1

正如nemesv所说.该参数是函数引用.所以你正在做的是使用函数的结果作为click事件.

您传递的函数调用将自动包含该项的数据,因此您无需手动传递:

<div data-bind="foreach: Contacts">
   <a data-bind="click: $parent.Foo, text: Name">link</a>
</div>

http://jsfiddle.net/4cUv9/

Answer 2

该click绑定的参数是一个函数引用.所以你需要将你的调用包装成一个匿名函数:

<div data-bind="foreach: Contacts">
   <a data-bind="click: function() { $parent.Foo($data); }, text: Name">link</a>
</div>

因此,当您想要将其他参数传递给click绑定时,您需要将其包装以生成函数.另请参阅单击文档中的示例

该<button data-bind="click: AddContacts">表达式工作,因为你直接引用的AddContacts函数存在.