将参数传递给knockoutjs viewmodel中的函数答案

【问题标题】：Passing parameters to a function in knockoutjs viewmodel将参数传递给knockoutjs viewmodel中的函数
【发布时间】：2012-02-23 17:40:37
【问题描述】：

我有这样的锚标记

<a href="#" class="btn btn-success order-btn" data-bind="attr:{'data-tiername':$data.tierName, 'data-identifier' : $parent.identifier}, click: $root.setPath.bind($data,$data.tierName, $parent.identifier)">Send values</a>

在视图模型中

var appViewModel = {
    setPath: function (data, tier, identifier) {
        alert(data);
        alert(tier);
        alert(identifier);
    },
...........
...........
}

结果是一些 knockoutjs 核心代码显示在警报消息中（可能定义 observable()、dependentObservable() 函数和使用 JSON.stringify 警报时为空的 [Object object]）

为什么会这样？

data-bind="attr:{'data-tiername':$data.tierName, 'data-identifier' : $parent.identifier}

但不是这个：

click: $root.setPath.bind($data,$data.tierName, $parent.identifier)

注意 tierName 是 observable()，标识符是 computed()

在哪里可以找到有关 bind() 的更多信息？？

【问题讨论】：

标签： knockout.js

【解决方案1】：

由于tierName 和identifier 是可观察的，您需要调用它们来访问它们的值：

click: $root.setPath.bind($data, $data.tierName(), $parent.identifier())

另外，bind() 中的第一个参数将绑定到setPath 中的this，所以我猜你需要这样的东西：

click: $root.setPath.bind(/*will be bound to this*/ $root, $data, 
                      $data.tierName(), $parent.identifier())

最后，如果$data 本身是可观察的（不清楚是否来自您的代码），那么您也需要调用它：

click: $root.setPath.bind($root, $data(), $data().tierName(), $parent.identifier())

还记得 bind 已在 ECMAScript 5 中引入，因此它可能不会出现在所有浏览器中。所以我可能会做这样的事情：

click: function(){$root.setPath($data, $data.tierName(), $parent.identifier());}

Here 是关于 bind 的附加信息。

【讨论】：

我想在我的视图模型函数中做alert(tier); alert(identifier);，我真的不想要上下文（这个）。所以我的功能变成了setPath(tier,identifier)谢谢你的帮助
KO 确实添加了bind 的实现（如果它不可用），因此如果您引用 KO，那么您可以安全地使用bind。

【解决方案2】：

bind 的第一个参数是执行函数时的目标（您希望 this 成为的目标）。因此，如果您希望 data 成为第一个参数，那么它需要成为第二个参数。

在你的函数内部，如果你正在处理 observables 或计算 observables，那么你需要打开它们来查看它们的值。您可以通过将其作为函数调用 alert(data()); 或调用 alert(ko.utils.unwrapObservable(data)); 来执行此操作（通常在您不知道设计类型时使用的是可观察的还是非可观察的可观察到的。

attr 和其他绑定在您传递 observable/computed observable 时起作用的原因是它们都为您调用 ko.utils.unwrapObservable 以方便您（因此您不必在传递 observable 时添加 ()，除非您正在写一个表达式!$data()。

这里有一些关于绑定的参考：https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind

【讨论】：

感谢@RPN 的回复，真的很有帮助。