Knockout 2.0 parameters from bind in incorrect order?

Question

With Knockout 2.0 using this data-bind:

data-bind="click: $root.deleteSomeEntity.bind($data, $parent)"

in the Knockout viewmodel JavaScript the first argument in

self.deleteSomeEntity = function (data, parent) {
    // perform deletion
}

seems to be the parent rather than the data.

Is there a reason for this behavior or something I'm missing?

Answer 1

When you call bind the first parameter will be the value of this. So, in your call this will be $data and the first argument will be $parent.

If $root is $parent in this case, then you can just do:

$root.deleteSomeEntity.bind($root)

KO will pass the data as the first parameter and this will be set to $root.

If $parent is not $root (and you likely don't want to rely on this being a different object that $root in your method on root), then you would do something like:

$root.deleteSomeEntity.bind($root, $data, $parent)

Otherwise, there are certainly ways to make sure that you have the proper this within your view model. It depends on your structure though.

Answer 2

Why are you using bind()? By default, if you just write the name of the javascript function as the click event Knockout will pass $data as the first argument and the event as the second.

http://knockoutjs.com/documentation/click-binding.html (Note 1&2)

Why bother with bind() when you can simply do this:

data-bind="click: function() {$root.deleteSomeEntity($data, $parent)}"