knockout.js:更新绑定?

Chr*_*gel 36 javascript knockout.js

当我在ko.applyBindings()之后将任何新元素注入到DOM中时 被召唤,然后淘汰赛将无法识别这些新元素.我可以理解为什么会这样 - 他们只是没有被淘汰索引.

所以,起初我认为这可以通过再次调用ko.applyBindings()来解决,在添加我的新元素之后,然后我意识到对于你做的每个ko.applyBindings()调用,相应的事件会多次被触发.因此,在应用五次后,点击:绑定将被触发五次,因此这不是一个理想的解决方案;)

有什么像ko.updateBindings()或其他东西,告诉敲门,嗯......更新元素绑定?

问候,克里斯

Col*_*inE 36

每次调用ko.applyBindings整个DOM时都会检查绑定.因此,如果您多次执行此操作,您将获得每个元素的多个绑定.如果您只想绑定一个新的DOM元素,可以将此元素作为参数传递给该applyBindings函数:

ko.applyBindings(viewModelA, document.getElementById("newElement"));
Run Code Online (Sandbox Code Playgroud)

看到这个相关的问题:

你能调用ko.applyBindings来绑定局部视图吗?


Sam*_*ens 7

如果你不知道自己到底做了什么,那么你似乎对此有了错误的看法.您的视图应由您的视图模型驱动.所以你不应该直接添加你需要应用knockout绑定的DOM元素.

相反,您应该更新视图模型以反映视图中的更改,然后导致新元素出现.

因此,例如,对于您而言$('body').append('<a href="#" data-bind="click: something">Click me!</a>');,在按钮应该可见时添加DOM元素,而不是使用视图模型控制按钮可见性.

所以你的视图模型包括

var viewModel = { clickMeAvailable: ko.observable(false) }
Run Code Online (Sandbox Code Playgroud)

你的HTML包括

<a href="#" data-bind="click: something, visible: clickMeAvailable">Click me!</a>
Run Code Online (Sandbox Code Playgroud)

当应用程序状态发生变化时,单击"我"按钮可用,您就可以了viewModel.clickMeAvailable(true).

这样做以及淘汰的重要部分是将业务逻辑与表示分开.所以点击我可用的代码并不关心点击我涉及一个按钮.所有这一切都是viewModel.clickMeAvailable在点击我可用时更新.

例如,单击"我"是一个保存按钮,当有效填写表单时,该按钮应该可用.您可以将保存按钮可见性与formValid可观察的视图模型联系起来.

但是,在表格生效之后,您决定改变方式,出现一个必须在保存之前同意的法律协议.表单的逻辑不会改变 - 它仍然formValid在表单有效时设置.您只需更改更改时formValid发生的情况.

正如lassombra在对此答案的评论中指出的那样,有些情况下直接DOM操作可能是您最好的方法 - 例如复杂的动态页面,您只需要根据需要水合部分视图.但是你放弃了Knockout提供的一些关注点.如果你正在考虑做出这种权衡,请注意.

  • 视图本身正在发生变化的特别大的网站怎么样?是否应将所有可能的视图打包到默认页面中?当然不是.当你转换到网站的其他"区域"时通过ajax加载视图当然是一个可接受的操作(我个人在我正在转换的Web应用程序中使用它.原始应用程序是MVC4并且对不同的个人管理数据有不同的视图我正在跟踪(股票,其他财务,待办事项列表,联系人列表,事件日历).由于它们都使用相同的母版页,因此将它们转换为MVVM/knockout非常简单. (3认同)