knockout.js - 使用 Durandal 一页中的多个独立 SPA

Question

我想在一个 HTML 页面（我们的旧版应用程序）中托管两个或多个单页应用程序。这些应用程序应该位于完全不同的页面位置 - 因此我不能将 durandal 组合用于顶级根“shell”并使用 ko compose 绑定进行组合。这些应用程序应该能够相互通信（路由器/事件聚合器）。

是否可以将 Durandal 及其路由器插件用于此类事情？什么是最好的方法？

我尝试使用多个applicationHost元素并app.setRoot(vm, transition, element)使用 vm/element 的不同组合进行调用，但没有运气。似乎最后一个电话赢了......

我还创建了关于 Durandal 谷歌群组的讨论：https ://groups.google.com/forum/?fromgroups=#!topic/durandaljs/e6GclW0bEo0

Answer 1

不幸的是，确保完全独立的应用程序的唯一方法是使用不同的文档 - iframe 或普通框架甚至不同的窗口。这是因为有很多共享状态，虽然 Durandal 是高度可配置的，但它有许多单例点：

• 大多数 durandal/* 组件期望作为单例工作；应用程序中的配置是共享的。应用程序上的订阅/事件是共享的。同样，默认模块查找规则也是共享的，因此需要使用特殊的“选择器”（即模块 id 上的应用程序前缀）。
• RequireJS 是一个单例；要求查找规则将被共享。
• 淘汰赛是单例；添加 bindingHandler 将在所有应用程序中共享。

因此，虽然可以创建一堆“合作”应用程序（想想“插件”），但每个应用程序都需要了解主机并小心避免冲突。还需要与模块路径（即每个应用程序名称的前缀）合作以提供相关的查找解决方案。

Answer 2

您是否打算将它们加载到同一个 HTML 页面中？如果是这样，那么您可以在外壳中创建不同的区域，每个区域一个。也许是左和右或上和下。每个都可以在 shell 中的一个部分或 div 中，并使用compose绑定来加载。

当然，您可以使用 Durandal 中的事件进行通信。

如果您并排加载两者，您需要决定如何响应路由更改。如果地址栏中的路线发生变化，您是将活动项绑定到左侧还是右侧？这显然取决于你。您可能希望创建一种更自定义的方法来加载不同的仪表板部分内容。但是，这实际上取决于您要如何重新加载它。

Answer 3

您可能可以在 iframe 中托管每个 durandal 实例。