javascript - Knockout JS 多个按钮，每个按钮都有点击功能

Question

我正在尝试使用一堆按钮，当您单击按钮时，它会提醒您其名称。目前我的代码如下所示:

HTML:

<ul data-bind="foreach: items">
   <button data-bind="text: name, click: alertName(name)"></button>
</ul>

JS:

ko.applyBindings({
    items: [{"name":"Burt"},{"name":"Sam"},{"name":"Greg"}]
});

function alertName(name){
     alert(name);
}

我遇到了一些错误:

Uncaught ReferenceError :无法处理绑定(bind)“foreach: function (){return items }”

消息:无法处理绑定(bind)“click: function (){returnalertName(name) }”

消息:alertName 未定义

在knockoutjs中有没有一种简单的方法可以实现这一点？我这里有一个jsfiddle:http://jsfiddle.net/hny7295e/

Answer 1

您应该创建一个 ViewModel。查看 ViewModels 上的文档。 alertName 方法应该位于此 ViewModel 上。由于该方法不在单个项目上，因此您需要使用 $parent.alertName()。循环中的当前项目将通过 knockout 传递给 alertName 方法。

function ViewModel() {
    var self = this;

    self.items = [{"name":"Burt"},{"name":"Sam"},{"name":"Greg"}];

    self.alertName = function (item) {
        alert(item.name);
    };
}

var viewModel = new ViewModel();

ko.applyBindings(viewModel);

JsFiddle