fiddle

我将其简化为此自定义绑定：

ko.bindingHandlers.table = {
    init: function tableBinding(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

        element.innerHTML = tableTemplate;

        var innerBindingContext = bindingContext.createChildContext(valueAccessor());

        ko.applyBindingsToDescendants(innerBindingContext, element);

        return {
            controlsDescendantBindings: true
        };
    }
};

这是模板的内容：

<!-- if: head && head.length -->
<thead>
<tr data-bind="foreach: head">
    <th data-bind="text: $rawData">not working th</th>
</tr>
</thead>
<!-- /ko -->

<tbody data-bind="foreach: rows">
<tr data-bind="foreach: $data">
    <td data-bind="text: $data">not working td</td>
</tr>
</tbody>

以及一些示例数据。

ko.applyBindings({
    table: {
        head: ["Name", "Position"],
        rows: [
            ["John", "Janitor"],
            ["Mike", "IT"],
            ["Paul", "HR"],
            ["Rick", "Coffee Fetcher"]
        ]
    }
});

我正在使用Knockout 3.0，但是任何可以在Knockout 2.x上运行的东西都可以在这里工作。如果你看小提琴，<thead>部分正确显示，但身体的绑定不是。如果我内联模板，它可以正常工作，并使用with绑定，如with: table。

Answer 1

我必须承认，目前我并没有关注你在这里所做的一切，但是如果你的if语句使用ko if:而不是{if:，我可以说你的例子会有用。 1}}。

http://jsfiddle.net/AhLzS/1/

所以不要这样：

<!-- if: head && head.length -->

顺其自然：

<!-- ko if: head && head.length -->

无容器绑定语法需要 ... 作为虚拟容器。因此，如果html注释语法只有，则knockout不会做任何特殊操作。

来自“if”绑定的淘汰文档：
http://knockoutjs.com/documentation/if-binding.html

和条评论作为开始/结束标记，定义包含内部标记的“虚拟元素”。昏死理解这个虚拟元素的语法并绑定，好像你有一个真实的容器元素。

使用虚拟元素的Knockout绑定不起作用

fiddle

1 个答案: