Question

我想使用Knockout实现一些可以轻松重用的东西（可能是自定义绑定），它可以应用标准绑定的混合：foreach绑定到tbody节点和另一个标准绑定（{ {1}}和visible）到其css子节点。

AFAIK，可以实现的最佳方式是编写自定义绑定我想这样使用它：

tr

，其中<table> <tbody data-bind="tableRows: { rows: unfilteredItems, filter: rowFilter }"> <tr data-bind="possibly, some hard coded bindings including visible and css bindings">...</tr> </tbody> </table>和unfilteredItems有些rowFilter。

我希望自定义绑定将此“转换”为以下内容，让KO按照最初的布局处理它：

observables

此处<table> <tbody data-bind="foreach: unfilteredItems"> <tr data-bind="visible: rowFilter($data), css: rowClass($data), and now hard coded bindings, if any">...</tr> </tbody> </table>是组件中包含的函数，只返回一个字符串，该字符串应根据当前rowClass()附加到tr的{{1}}属性。

我知道如何将class绑定应用于应用绑定的节点：

$data

这部分工作正常。

但我找不到如何向子foreach节点添加绑定，以便ko.bindingHandlers.tableRows = { init: function (element, valueAccessor, allBindings, viewModel, bindingContext) { var options = valueAccessor(), rows = options.rows; ko.applyBindingsToNode(element, { foreach: rows }, bindingContext); } };绑定处理子节点时，绑定（以及已经绑定的所有绑定）包含在子布局中）以与最初在布局中相同的方式应用和处理。

我可以尝试使用JS DOM API手动将所需的绑定作为tr函数中的字符串添加到子foreach节点，但我觉得使用某些KO应该是更清晰的解决方案API。

此外，当tr节点上最初有另一个绑定包括init和tr绑定时，我需要自定义绑定来正确处理案例。

我的项目使用Knockout 2.2.1，如果可能的话，如果解决方案不依赖于Knockout 3功能会很好。

有人可以建议如何实现这个目标吗？

Answer 1

我认为您应该能够使用jQuery's data或类似内容修改data-bind内部元素的foreach属性。外部将在其内部部件之前由Knockout处理。我自己还没有尝试过这样的事情。

事实上，由于您只是在进行样板重写，因此您可以在应用Knockout绑定之前使用jQuery查找并重写标记。这样可以节省自定义绑定处理程序。

Answer 2

您可以为foreach绑定创建自己的tr模板，如

<script type="text/html" id="rowTemplate">

    <tr data-bind="css:{'success': $root.rowClass($data)}, visible: $root.rowFilter($data)">
        <td data-bind="text: name"></td>
    </tr>

</script>

并将其作为

呈现在自定义绑定中

ko.applyBindingsToNode(element, {template:{foreach: data, name: "rowTemplate"}}, bindingContext);
return { controlsDescendantBindings: true };

自定义绑定（？），为子节点

2 个答案: