knockout.js - 当 $parent.foo 是原型(prototype)方法时， this 不是父方法，解决方法？

Question

在我的 View 模型中，我有原型(prototype)方法，其中 this 上下文是 for each 中的项目，而不是实际的 View 模型。我如何实现这一目标？

  <button data-bind="click: $parent.methodThatNeedsAccesToTheParentViewModel">Edit</button>

View 模型:

ViewModel.prototype.methodThatNeedsAccesToTheParentViewModel= function () {
        this = duff //this is the item in the foreach, not the real parent
    };

想法？

Answer 1

不要将函数直接传递给点击绑定(bind)，将其包装在一个匿名函数中，以便在 View 模型的上下文中调用它:

<button data-bind="click: function() { $parent.methodThatNeedsAccesToTheParentViewModel() }">Edit</button>

这样，当绑定(bind)被激活时，它将使用 $parent 作为调用的上下文 - 即 this

值得注意的是(因为我们看不到文件绑定(bind)的结构)$parent 变量将引用 绑定(bind) 在被迭代的当前项目之前，它不一定是对象图中项目的父项。

编辑 : 我在上面遗漏了一些括号......

编辑 2 :这是由于绑定(bind)的解决方式而起作用的。当通过 knockout 应用绑定(bind)时，表达式被解析并且必须评估为函数(因此当您直接绑定(bind)到函数时不需要括号)。然后在激活点击绑定(bind)时调用此函数。

但这里有个问题，因为 这个原型(prototype) javascript 中的关键字不受函数所有者的约束(即在哪里定义)，而是在调用它的方式上(如 mozilla documentation 中更好地解释)在这种情况下， knockout 调用函数不是通过对象拥有它(这将正确绑定(bind) 这个 运算符)，但将其显式绑定(bind)到其当前绑定(bind)上下文(因为它不可能知道该函数最初是哪个实例)。您可以通过获取对您的函数的引用然后在调用时将其绑定(bind)到另一个对象来复制此行为 - 例如:

A = function() {
   this.name = "foo";
};
A.prototype.getName = function() { return this.name; };

a = new A();

console.log(a.getName()); // should log "foo" as expected

f = a.getName; // now f contains a reference to the function

console.log(f()); // this call the function in the current scope - most likely the window, and return nothing

b = new Object(); // another generic object - suppose this is knockout binding context

console.log(f.call(b)); // this bind the call explicitly to b, but since b has no name property,  nothing is returned again

console.log(f.call(a)); // this time we bind the function call to an object that has a name proerty, so the correct value is returned

另一方面，通过创建一个匿名函数，您将在所需对象($parent)的范围内显式调用您的方法，因此 这个绑定(bind)正确。

我希望这会有所帮助... :)