使用Durandal在一个页面中使用多个独立SPA

Question

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

是否可以使用Durandal及其路由器插件进行此类操作？什么是最好的方法？

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

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

Answer 1

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

• 大多数durandal / *组件都希望以单身人士的身份工作; app中的配置是共享的。应用程序上的订阅/活动是共享的。类似地，默认模块查找规则也是共享的，因此需要使用特殊的“选择器”（即模块ID上的app前缀）。
• RequireJS是单身人士;要求查找规则将被共享。
• 淘汰赛是一个单身人士;添加bindingHandler将在所有应用程序中共享。

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

Answer 2

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

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

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

Answer 3

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