applyBindings方法的第二个参数用于什么?

8 浏览
0 Comments

applyBindings方法的第二个参数用于什么?

我一直在寻找但找不到关于applyBindings()的文档。第二个参数可以包含什么内容?它可以是一个元素数组吗?必须是一个单独的元素吗?如果调用两次applyBindings将绑定应用于两个不同节点的子元素,是否有效?\n

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

0
0 Comments

如果有人想要使用类来实现这个功能,可以使用以下代码:

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

这段代码创建了n个MyView的实例,这些实例之间没有关联。在许多情况下,这可能是一个不好的解决方案。

问题的原因是在循环中使用了`ko.applyBindings`函数的第二个参数。这个参数用于指定要将绑定应用到的DOM元素。在这个例子中,循环通过`$('.myView')[i]`来指定要绑定的DOM元素。由于每次循环都会创建一个新的MyView实例并将其绑定到不同的DOM元素上,所以最终会创建n个不相关的MyView实例。

要解决这个问题,可以使用`ko.applyBindingsToNode`函数来将绑定应用到单个的DOM元素上,而不是在循环中使用`ko.applyBindings`函数。这样可以确保只有一个MyView实例被创建并与相应的DOM元素进行绑定。

以下是修改后的代码:

for (let i of $('.myView')) {
  ko.applyBindingsToNode($('.myView')[i], null, new MyView());
}

通过将`ko.applyBindingsToNode`函数应用到单个的DOM元素上,可以确保只有一个MyView实例被创建,并且每个实例与其相应的DOM元素进行了正确的绑定。这样可以避免创建不相关的实例,并提供更好的解决方案。

0
0 Comments

applyBindings的第二个参数用于指定在哪个部分的文档中搜索data-bind属性。这在想要在页面的不同区域使用不同的视图模型时非常有用。

解决方法就是在调用applyBindings时传入第二个参数,该参数可以是一个元素的ID或一个DOM元素对象。通过传入限定范围的元素,可以仅在指定的元素及其子元素中激活绑定。

下面是一个示例代码,演示如何使用applyBindings的第二个参数:

// HTML

// JavaScript var viewModel1 = { name: "John" }; var viewModel2 = { age: 25 }; // 使用第二个参数限定范围 ko.applyBindings(viewModel1, document.getElementById('viewModel1')); ko.applyBindings(viewModel2, document.getElementById('viewModel2'));

在上面的例子中,我们有两个不同的视图模型(viewModel1和viewModel2),并且在页面上有两个不同的区域(ID为viewModel1和viewModel2的div元素)。通过使用applyBindings的第二个参数,我们可以将viewModel1绑定到ID为viewModel1的元素及其子元素中,将viewModel2绑定到ID为viewModel2的元素及其子元素中。

这样做的好处是,每个视图模型都可以独立地管理自己的区域,而不会干扰其他区域的绑定。

0
0 Comments

applyBindings的第二个参数用于定义要搜索data-bind属性的文档的哪个部分。如果没有指定第二个参数,它默认为整个文档的根节点(window.document.body)。applyBindings函数会将viewModelOrBindingContext参数绑定到指定的DOM节点及其后代节点上。

根据KnockoutJS的源代码,applyBindings函数会检查rootNode参数的nodeType是否为1(ELEMENT_NODE)或8(COMMENT_NODE),如果不是,则会抛出错误。

根据KnockoutJS的文档,可以选择性地传递一个第二个参数来限制绑定的范围。这个参数可以是一个DOM节点,例如document.getElementById('someElementId'),这样就只会将绑定限制在具有ID为'someElementId'的元素及其后代节点上。这在需要多个视图模型并将每个视图模型与页面的不同区域关联时非常有用。

只要节点不共享树的一部分(例如它们是兄弟节点),就可以安全地在每个节点上调用applyBindings函数(这实际上是使用第二个参数的一个原因)。

总之,applyBindings函数的第二个参数用于指定要搜索data-bind属性的文档的特定部分,它必须是一个单独的DOM节点,否则会抛出错误。

0