Question

我尝试使用淘汰组件创建一个页面，如果没有同时添加多个组件，我在尝试绑定页面中的多个组件时会遇到一些麻烦。据我所知，我无法直接访问组件的viewmodel，将其绑定到特定元素。

ko.applyBindings(viewModel, document.getElementById("component1"));

我的问题是，因为我因此必须使用更一般的

ko.applyBindings()

如果我稍后在页面中添加另一个组件，并想要绑定它，我会收到＆＃34;您不能多次将绑定应用于同一个元素。＆＃34;错误。

我有什么方法可以访问组件视图模型并直接应用它？

$('body').append('<div id="compoent1" data-bind=\'component: { name:"someComponent"\}'></div>')
ko.applyBindings(viewModel/*How do I get this?*/, document.getElementById("component1"));

我尝试过使用

ko.applyBindings(document.getElementById("component1"));

我的解释可能有点难以理解，这里是我想要做的伪代码：

Add a knockout component
Apply bindings for the knockout component
.... some time later in my single page application
Add another knockout component
Apply bindings for the new knockout component

Answer 1

在我看来，您可能正在尝试使用非敲除方法添加组件。

一旦你淘汰出局，最好将所有东西都放在淘汰赛中，并抵制回到jQuery或直接DOM操控以获得“快速获胜”的诱惑。以后它总是咬你...所以：

 <foocomponent params="woo:'fwoo'"></foocomponent >
 <!-- ko if:someBooleanObservableThatChangesLater -->
     <myawesomecomponent params="choo:'boo'"></myawesomecomponent >
 <!-- /ko -->

现在我们通过更改根模型（someBooleanObservableThatChangesLater）中的observable来“添加”第二个组件。无需重新绑定。

您的情况可能与我上面相当简单的例子有些不同，但希望意图很明确。您可以通过将项目推送到observableArray并使用foreach绑定来获得类似的行为，以便在您更改observableArray时将内容添加到DOM或从DOM中删除。再一次，不需要再次拨打applyBindings。

淘汰组件 - 不能多次应用绑定

1 个答案: