这并不引用 observableArray 模板绑定中的 viewmodel
尝试使用新的更简洁的事件处理在 Knockout 2 中以及新的控制流绑定中，我正在致力于实现一个简单的动态列表，添加和删除字符串。所以我的标记大致如下所示：
<div data-bind="foreach:myList">
<input data-bind="value: $data" />
<button data-bind="click:$parent.removeFromList">X</button>
</div>
我的视图模型有一个匹配的删除函数，它模仿 来自 Steve Sanderson 的示例。
removeFromList: function(item) {
this.myList.remove(item);
}
现在我希望“this”引用视图模型，项目引用被删除的数组成员（因为 事件处理程序现在接收当前模型值作为其第一个参数）。然而，“this”似乎也指被删除的字符串。因此，当我单击“删除”时，我得到：
this.myList is undefined
我在 http://jsfiddle.net/davidc/rFd7H 创建了一个 JSFiddle / 这说明了我的问题。我应该如何从列表中删除项目？
Trying to use the new cleaner event handling in Knockout 2 along with the new control flow bindings I'm working on implementing a simple dynamic list, adding and removing strings. So my markup roughly looks like this:
<div data-bind="foreach:myList">
<input data-bind="value: $data" />
<button data-bind="click:$parent.removeFromList">X</button>
</div>
and my viewmodel has a matching remove function which immitates a sample from Steve Sanderson.
removeFromList: function(item) {
this.myList.remove(item);
}
Now I would expect 'this' to refer to the viewmodel and item to refer to the array member being removed (since event handlers now receive the current model value as their first parameter). However, 'this' also seems to refer to the string being removed. Therefore when I click remove I get:
this.myList is undefined
I've created a JSFiddle at http://jsfiddle.net/davidc/rFd7H/ which illustrates my problem. How should I be removing items from the list?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
有多种方法可以确保您的处理程序具有正确的“this”值。
在函数中构建视图模型，并对当前
this使用bind示例：http://jsfiddle.net/rniemeyer/rFd7H/4/。或者不要在函数中构建视图模型并使用bind，例如： http ://jsfiddle.net/rniemeyer/rFd7H/10/在函数中构建视图模型，并保留一个具有正确值
this的变量，并在您的处理程序。示例：http://jsfiddle.net/rniemeyer/rFd7H/5/绑定绑定中的正确上下文，例如：
data-bind="click: $parent.removeFromList.bind($parent)"示例：http://jsfiddle.net/rniemeyer/rFd7H/8/以匿名身份调用
$parent对象的函数，例如：data-bind="function() { $parent.removeFromList($data); }"一般来说，不推荐，因为它使标记变得丑陋/冗长。示例：http://jsfiddle.net/rniemeyer/rFd7H/9/There are many ways that you can ensure that your handler has the correct value for "this".
Build your view model in a function and use
bindagainst the currentthisSample: http://jsfiddle.net/rniemeyer/rFd7H/4/. Or don't build your view model in a function and usebindlike: http://jsfiddle.net/rniemeyer/rFd7H/10/Build your view model in a function and keep a variable with the correct value of
thisand use it in your handler. Sample: http://jsfiddle.net/rniemeyer/rFd7H/5/Bind to the correct context within your binding like:
data-bind="click: $parent.removeFromList.bind($parent)"Sample: http://jsfiddle.net/rniemeyer/rFd7H/8/Call it as an anonymous function off of the
$parentobject like:data-bind="function() { $parent.removeFromList($data); }"Generally, not recommended, as it makes the markup ugly/verbose. Sample: http://jsfiddle.net/rniemeyer/rFd7H/9/