bindingHandlers 中的淘汰赛范围问题答案

【问题标题】：Knockout Scope Issue in bindingHandlersbindingHandlers 中的淘汰赛范围问题
【发布时间】：2016-03-10 19:30:53
【问题描述】：

我有一个视图模型 MyClass，它有一个数组属性 MyList，而 MyList 是一个具有 Prop1 和 MySubList 等属性的对象。

我有一个<div data-bind="with: MyClass">，我在其中构建了一个表。我希望表格的列是可排序的，所以大多数 <th> 看起来像这样：

<th data-bind="sort: { myArray: MyList, myProperty: 'Prop1' }">Prop One</th>

我有一个前面提到的sort 的 ko.bindingHandler，它通过 myArray 运行，在 myProperty 上排序。这一切都很好。

当需要处理MySubList 属性的条目时，我想创建可变数量的列，MySubList 中的每个项目对应一个。

现在，从MyClass 的一个实例到另一个实例，MyList 中的项目数可能会有所不同，但在 MyList 的各个项目中，MySubList 中的项目数是固定的，所以我可以从任何MyList 项目中可靠地确定我需要的列数。

所有这些项目都是可观察的。

所以，为了提供可变数量的列，我有这个结构：

<!-- ko foreach: { data: MyList()[0].MySubList, as: 'subList' -->
<th data-bind="sort: { myArray: MyList, myProperty: 'SomeSubListProperty' }"></th>
<@-- /ko -->

列出来的很好。但问题是：在sort 处理程序中，MyList 是未定义的。 MySubList 也是。由于 MyList 没有为上面的其他 <th> 定义，我的猜测是 ko foreach 引入了一个新的范围。当然，MyList 在实际的 foreach 语句的范围内，因为data 与subList 一样有效。因此，我正在寻找一种方法将对 MyList 的良好引用传递给sort。

这足以继续吗？

【问题讨论】：

标签： javascript knockout.js scope

【解决方案1】：

由于您在循环中更改了范围，因此您需要从循环中访问父范围，这可能会有所帮助：

<!-- ko foreach: { data: MyList()[0].MySubList, as: 'subList' -->
<th data-bind="sort: { myArray: $parent.MyList, myProperty: 'SomeSubListProperty' }">  </th>
<@-- /ko -->

【讨论】：