1

Knockout.js主页上的视频教程中,演示者设置了一个简单示例,其中 ViewModel 包含一个observableArray包含自定义对象(在本例中为“朋友”对象)实例的属性:

function friend(name) {
  return {
    name: ko.observable(name),
    remove: function () {
      viewModel.friends.remove(this);
    }
  };
}

var viewModel = {
  friends: ko.observableArray()
}

ko.applyBindings(viewModel);

然后使用 KO 模板进行渲染:

<script id="friendsTemplate" type="text/html">
  <li>
    <input data-bind="value: name" />
    <button data-bind="click: remove">Remove</button>
  </li>
</script>

friend在我看来,从 ViewModel 的friends集合中删除对象(模型?)的逻辑是在friend对象本身中实现的,这对我来说似乎很奇怪。friend这不会在对象和 ViewModel 实例之间产生不希望的耦合吗?是否有更一致的设计方法允许removeFriend在 ViewModel 中而不是在friend对象中定义功能?

4

1 回答 1

3

一种更常见的模式是将removeFriend函数置于更高级别并使用以下方式绑定到它:

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

click当 Knockout 从or绑定调用处理程序时,event它将当前数据项作为第一个参数传递。它还将设置上下文 ( this) 也等于当前数据。根据您的结构,您可能必须bind确保使用适当的上下文调用该函数或使用类似var self = this;.

因为,viewModel是一个对象文字,在这种情况下removeFriend可能看起来像:

friends: ko.observableArray(),
removeFriend: function(friend) {
    viewModel.friends.remove(friend);
}
于 2013-06-10T02:01:35.970 回答