3

我有这个非常简单的测试视图

<button data-bind="click: add">Add</button>
<table data-bind="foreach: items">
    <tr>
        <td data-bind="text: name"></td>
        <td><button data-bind="click: $root.remove">Remove</button></td>
    <tr>
</table>

小提琴：http: //jsfiddle.net/6PP5m/

问题在于 remove 方法中 this 的上下文是触发点击事件的子视图模型

我还没有找到我喜欢的解决方案，您可以在构造函数中添加一个 self 变量并使用它而不是“this”，但它更干净的代码和 OO 使用“this”关键字

小提琴：http: //jsfiddle.net/Qn2CM/

您也可以创建一个代理函数委托，但它仍然不是很干净的代码

小提琴：http: //jsfiddle.net/gYhMr/

我想告诉 ko 以某种方式将 this 的上下文设置为正确的范围（在这种情况下为 $root ）是否可能？

4

1 回答 1

6

如您所见，单击/事件绑定在当前数据的上下文中运行。

有几个选项可以确保您的函数在正确的上下文中运行：

  • 将正确设置this为变量self并在您的处理程序中使用它（正如您所提到的）
  • $.proxy在您的视图模型中使用或类似的东西.bind来确保它this是正确的（正如您所提到的）
  • 将函数内联绑定data-bind="click: $root.remove.bind($root)"
  • 使用一个（丑陋的）匿名函数，比如data-bind="click: function() { $root.remove($data); }"
于 2012-05-24T13:17:43.897 回答