Question

我一直在寻找，但找不到applyBindings()的文档。第二个参数可以合法地包含哪些内容？它可以是一系列元素吗？它必须是一个单一元素吗？可以通过两次调用applyBindings将绑定应用于两个单独节点的子元素吗？

       ko.applyBindings(myViewModel, div1);
       ko.applyBindings(myViewModel, div2);

Answer 1

KnockoutJS是开源的。来自relevant file：

ko.applyBindings = function (viewModelOrBindingContext, rootNode) {
    // Some code omitted for brevity...

    if (rootNode && (rootNode.nodeType !== 1) && (rootNode.nodeType !== 8))
        throw new Error("ko.applyBindings: first parameter should be your view model; second parameter should be a DOM node");
    rootNode = rootNode || window.document.body; // Make "rootNode" parameter optional

    applyBindingsToNodeAndDescendantsInternal(getBindingContext(viewModelOrBindingContext), rootNode, true);
};

所以是的，它似乎必须是一个DOM节点。更具体地说，nodeType必须是1（ELEMENT_NODE）或8（COMMENT_NODE），否则会抛出错误。

relevant documentation ("Activating Knockout")不太明确，它必须是一个DOM节点，但（参见重点，由我添加）确实有点说同样的事情：

或者，您可以传递第二个参数来定义要搜索data-bind属性的文档的部分。例如，ko.applyBindings(myViewModel, document.getElementById('someElementId'))。这会将激活限制为ID为someElementId及其后代的元素，如果您希望拥有多个视图模型并将每个视图模型与页面的不同区域相关联，这将非常有用。

只要节点不共享树的一部分（例如，它们是兄弟姐妹），您就可以在每个节点上安全地调用applyBindings（事实上，这是使用第二个参数的一个原因）。

有关典型用例，请参阅this related question。

Answer 2

可在以下链接中找到... http://knockoutjs.com/documentation/observables.html

如果您想知道ko.applyBindings的参数是什么，

第一个参数说明要使用的视图模型对象   它激活的声明性绑定

或者，您可以传递第二个参数来定义哪个部分   要搜索数据绑定属性的文档。例如，   ko.applyBindings（myViewModel，   的document.getElementById（ 'someElementId'））。这限制了   激活ID为someElementId及其后代的元素，   如果您想拥有多个视图模型并关联，这非常有用   每个页面都有不同的区域。

Answer 3

如果有人想要使用类来实现这个

for i of $('.myView')
  ko.applyBindings(new MyView(),$('.myView')[i])

Answer 4

如果您正在使用JAVA Script，那么请转到根节点元素

 ko.applyBindings(vm, document.getElementById("yourRootID"));

就我而言，HTML就像这样：

<table id="yourRootID" border="1" class="table">
    <thead>
        <tr data-bind="foreach: columnNames">
            <th> <span data-bind="text: $data"></span></th>
        </tr>
    </thead>
    <tbody data-bind="foreach: items">
        <tr data-bind="foreach: $parent.columnNames">
            <td data-bind="text: $parent[$data]"></td>
        </tr>
    </tbody>
</table>

请记住使用document.elementByID，因为它需要根节点

applyBindings的第二个参数用于什么？

4 个答案: