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

Question

我有像这样的锚标签

<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>

在viewmodel中

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

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

这为什么有效？

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

但不是这个:

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

请注意,tierName是一个observable(),标识符是计算的()

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

Answer 1

执行函数时,第一个参数bind是目标(您希望this是什么).所以,如果你想data成为第一个参数,那么它需要是第二个参数.

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

attr当你传递一个observable/computed observable时,和其他绑定工作的原因是它们都ko.utils.unwrapObservable为了方便而调用你(所以你不必()在传递observable时添加,除非你正在编写一个表达式!$data().

以下是关于bind的一些参考:https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind

Answer 2

由于tierName和identifier是可观察,你需要给他们打电话来访问它们的值:

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

此外,在第一个参数bind()将被绑定到this的setPath,所以我想你需要的东西是这样的:

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())

还记得在ECMAScript 5中引入了bind,因此它可能不会出现在所有浏览器中.所以我可能会这样做:

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

这是有关bind的其他信息.