Knockout:通过自定义元素将当前对象传递给方法

Viq*_*qas 5 javascript knockout.js custom-element

我有一个自定义 html 元素(一个按钮),我正在向其传递一个方法。然后,这由自定义元素中的淘汰绑定执行。问题是,我需要在选择时访问数组中的当前对象。我已经实现了这样的目标:

ko.components.register('custom-element', {
    viewModel: function(params) {

      this.nestedMethod = function (){
        //this line feels dirty
        var parameter = ko.contextFor(arguments[1].target).$parent;
        params.method(parameter);
      }
    }, 
    template:
    '<button data-bind="click: nestedMethod">remove item</button>'
});
Run Code Online (Sandbox Code Playgroud)

这感觉非常老套并且可能容易崩溃。有更好的方法来实现这一目标吗?这是一个工作示例的链接:

http://liveweave.com/w0L5w5

hai*_*770 1

由于 Knockout 组件旨在跨页面和视图模型可重用,因此它们不应依赖于组件自己的视图模型之外的视图模型。

但是,您可以通过将当前数据bindingContext作为params对象的一部分传递来访问所需的数据。

例如(在您的 HTML 中):

<custom-element params="method: $parent.removeItem, bindingContext: $context" />
Run Code Online (Sandbox Code Playgroud)

在你的JS中:

viewModel: function(params) {
  this.nestedMethod = function (){
    var bindingContext = params.bindingContext;

    // @access using the following:
    // var rootVm = bindingContext.$root;
    // var currentData = bindingContext.$data;
    // var parentData = bindingContext.$parent;

    var parameter = ko.contextFor(arguments[1].target).$parent;
    params.method(parameter);
  }
},
Run Code Online (Sandbox Code Playgroud)