KnockoutJS - 主视图中有多个部分视图？答案

【问题标题】：KnockoutJS - Multiple partial views within on main view?KnockoutJS - 主视图中有多个部分视图？
【发布时间】：2011-09-24 11:20:00
【问题描述】：

我正在尝试将现有的 asp mvc 应用程序移植到使用 knockoutjs（纯 js/html），因为我不再需要 asp mvc 中的任何功能。但是，我可以预见的一个问题是我处理某些页面的方式。

我有一页包含大约 12 个局部视图，每个局部视图都有自己的模型。现在使用 Knockout JS，您似乎每页实际上应该只有 1 个视图模型/视图，但是我拥有的页面包含大量信息，这些部分类似于：

如果部分细节发生变化，为了让事情变得更加棘手，它需要更改另一部分的数据。因此，假设您删除了一张卡，然后它需要告诉资金控制它不再有卡，因此不会有资金。（这都是一个抽象的例子，但希望能说明这一点）

所以我有点不确定如何在淘汰赛中做到这一点，因为那宁愿把它作为一个大模型，我很乐意这样做，但它包含很多信息。以及多种表格，因为您可以更新您的地址而无需更新其他所有内容。

所以我应该只为这个视图制作一个大模型并处理它吗？或者有没有办法让意见相互交流？

【问题讨论】：

有没有人有任何关于 Knockout 的一般教程，因为我发现文档有点短，而且只有一些小例子。没有什么比演示应用程序更重要的了
只是为演示应用程序添加一些上下文，我发现他们的网站有一些不错的示例，但他们似乎只使用了视图模型和视图，而不是模型，那么这个其他模型是什么所有关于？否则它只是 VVM...

【解决方案1】：

我会告诫不要使用怪物视图模型，因为它会产生紧密耦合，您希望在复杂的应用程序中避免这种耦合。

更好的解决方案是在ko.subscribable 之上构建一个发布/订阅系统。然后通过管理对各种事件的订阅来促进视图模型之间的通信。前期工作要多一些，但它会在未来带来红利。

Here 是一篇扩展该主题的博文。我强烈推荐这个博客。它是针对特定淘汰赛挑战和策略的绝佳资源。

【讨论】：

是的，伙计，你的权利，pub/sub 在这种情况下运行良好。我有 6 个小型视图模型，它们都通过 pub/sub 库（邮箱）进行通信。非常松散的耦合，更适合重构、测试和重用。

【解决方案2】：

我的策略是使用一个大视图模型。不管怎么说，局部视图是服务端的概念，一旦全部转移到客户端，就是一个页面中的大量数据信息。

但是，为了让事情变得易于管理，我确保每个 Javascript 操作代码都写在它自己的 Partial 视图中。这样可以更轻松地跟踪功能及其各自的代码。

所以基本上你在主页中填充你的主客户数组对象，然后调用函数来填充详细信息、地址等，它们分别在每个局部视图中定义。

【讨论】：

感谢您的回复，我仍然担心一种大型模型样式的一件事是，较大模型中的每个模型（即地址、卡）都是独立保存的。但是，从我最初的外观来看，您似乎一次保留了整个模型……我是否必须编写任何自定义内容才能做到这一点？还是就像将 saveCard(index) saveAddress(index) 公开为仅将其发送到服务器的方法一样简单？
并非如此。如果您有较大模型下的模型，则只需确保在局部视图中正确引用它们，例如<a data-bind="click:Card.addNew">Add Card</a> 。不过我还没有真正测试过，因为我最终把所有东西都放在了一个视图模型中。模型内部没有模型；不完全是一个很好的解决方案。
顺便说一句，我刚刚意识到您还可以通过将部分视图封装在 div 中然后调用 ko.applyBinding(partialViewModel, "id of div") 来应用多个绑定。第二个参数描述了将绑定应用到的位置。
感谢您提供的所有信息，对于我目前的工作来说应该绰绰有余。